gpt4 book ai didi

javascript - 我的问题是关于无法绑定(bind)到 'ngFor' 因为它不是 'li' 的已知属性,为什么会收到此错误?

转载 作者:行者123 更新时间:2023-11-28 14:25:36 25 4
gpt4 key购买 nike

错误指向nonvegfoodlist的*ngFor

app.component.ts

import { Component } from '@angular/core';
export class Menu
{
id : number;
name :string;
}
const veg : Menu[] = [

{ id:1 , name:'Rice'},
{ id:2 , name:'Dosa'},
{ id:3 , name:'Biriyani'},
{id :4 , name:'Pongal'}
];
const nonveg :Menu[] =[

{id :5 , name:'Fish Curry'},
{id:6, name:'Fish Fry'},
{ id:7 , name:'Half CB'}
];
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'Restarunt';
vegfoodlist = veg ;
nonvegfoodlist = nonveg;

}

app.component.html

<html>

<body>
<h1>
{{title}}
</h1>
<h2>Veg Food list</h2>
<div>
<ul class="vegfoodlist">

<li *ngFor ="let content of vegfoodlist">
<span>{{content.name}}</span>
</li>
</ul>
</div>
<div>
<ul class=" nonvegfoodlist">
<li *ngFor ="Let conten in nonvegfoodlist">
<span>{{conten.name}}</span>
</li>
</ul>
</div>
</body>
</html>

这是从控制台收到的错误列表:

Can't bind to 'ngFor' since it isn't a known property of 'li'

Property binding ngFor not used by any directive on an embedded template. Make >sure that the property name is spelled correctly and all directives are listed in the "@NgModule.declarations".

这些是我的问题,1)是否可以使用多个ngFor

最佳答案

NgFor 是位于 CommonModule 中的结构指令。您需要导入 CommonModule 并将其添加到您使用 NgFor 的模块中。

关于javascript - 我的问题是关于无法绑定(bind)到 'ngFor' 因为它不是 'li' 的已知属性,为什么会收到此错误?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53512603/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com