问题的根本原因是Angular无法将'ngForOf'绑定到'li'元素,因为'ngForOf'不是'li'元素的已知属性。虽然这不是一个真正的错误,但可以通过以下几种方法解决。
方法1:确保导入了'CommonModule'模块 在使用*ngFor指令之前,请确保在使用的组件中导入了'CommonModule'模块。
import { CommonModule } from '@angular/common';
@NgModule({
imports: [
CommonModule
],
...
})
export class YourModule { }
方法2:使用ng-container元素 如果想要在'li'元素上使用*ngFor指令,可以使用ng-container元素来包裹'li'元素。ng-container元素是一个逻辑容器,不会被渲染到DOM中,可以用于包裹结构,不会引起错误。
- {{ item }}
方法3:使用ng-template元素 另一种解决方法是使用ng-template元素来定义重复的结构,并将其放置在li元素中。然后,使用ngFor指令将ng-template应用到li元素上。
-
{{ item }}
这些方法可以解决'ngForOf'不是'li'元素已知属性的问题,并可以正确地在'li'元素上使用*ngFor指令。