我在 Typesript 中創建了合適的 Ingredient 物件,也為該物件創建了合適的“模型”。盡管 ngfor 指令不起作用。在瀏覽器中檢查時,我收到此錯誤“NG0303:無法系結到 'ngforOf' 因為它不是 'a' 的已知屬性”。
我的型號代碼
export class Ingredient {
constructor(public name: string, public amount: number){}
}
我的打字稿代碼
import { Component, OnInit } from '@angular/core';
import { Ingredient } from '../shared/ingredient.model';
@Component({
selector: 'app-shopping-list',
templateUrl: './shopping-list.component.html',
styleUrls: ['./shopping-list.component.css']
})
export class ShoppingListComponent implements OnInit {
ingredients: Ingredient[] = [
new Ingredient ("Apple", 5),
new Ingredient ("Tomato", 5)
];
constructor() { }
ngOnInit(): void {
}
}
我的 HTML 代碼
<div class="row">
<div class="col-xs-10">
<app-shopping-edit></app-shopping-edit>
<hr>
<ul class = "list-group">
<a class = "list-group-item"
style = "cursor : pointer"
*ngfor = "let ingredient of ingredients">
{{ ingredient.name }}({{ ingredient.amount}})
</a>
</ul>
</div>
</div>
頁面正在正確加載,但未加載成分。在瀏覽器中檢查此錯誤“NG0303:無法系結到 'ngforOf' 因為它不是 'a' 的已知屬性”即將到來。
有人可以幫忙嗎。
uj5u.com熱心網友回復:
嘗試移動標簽*ngFor內部ul。
編輯:你有一個錯字......它是*ngFor="",不是*ngfor=""。
uj5u.com熱心網友回復:
如果您在內部,AppModule請檢查您是否BroswerModule在匯入陣列中。如果您在某個不同的模塊中,則檢查是否CommonModule是該模塊陣列的一部分。CommonModule為我們提供核心 Angular 功能,例如*ngIf或*ngFor在您的特定情況下。同時還要注意,您鍵入*ngfor代替*ngFor。
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/385187.html
上一篇:有沒有辦法模擬茉莉花間諜的功能
