自定义组件中的ngFor

Question

我在Ionic v3中使用自定义组件，我正在尝试使用ngFor。

在我的.ts文件中，我在我的ngOnInit中有这个：

this.nb_stars = [];

for(let i=1; i<=4; i++) {
   this.nb_stars.push(i);
}

在我的.html中我是这样的：

<div *ngFor="let star in nb_stars">
    test
</div>

但我有这个错误：

未捕获错误：模板解析错误：无法绑定到'ngForIn'，因为它不是'div'的已知属性。 （“ - >] * ngFor =”让测试在nb_stars“>

“）：ng：///ComponentsModule/CompStarsComponent.html@3：5属性绑定ngForIn未被嵌入式模板上的任何指令使用。

确保属性名称拼写正确，并且所有指令都列在“@ NgModule.declarations”中。 （“ - > [错误 - >]

如果有人可以帮助我。

Answer 1

你需要在in指令中用of替换ngFor来获取值。 当我们必须迭代值时使用of，当我们必须迭代属性时使用in。 请在下面找到详细代码：

<!-- Using of, which iterates over values -->
<div *ngFor="let star of nb_stars">

和

<!-- Using in, which iterate over properties -->
<div *ngFor="let star in nb_stars">

另外，根据您收到的错误，您必须在根模块（app.module.ts）中导入CommonModule，如下所示：

import { CommonModule } from "@angular/common";
@NgModule({
    imports: [CommonModule]
})