我使用的是Angular2 2.1.0。当我想要显示公司列表时,我得到了这个错误。

在file.component.ts中:

public companies: any[] = [
    { "id": 0, "name": "Available" },
    { "id": 1, "name": "Ready" },
    { "id": 2, "name": "Started" }
];

在file.component.html中:

<tbody>
  <tr *ngFor="let item of companies; let i =index">
     <td>{{i}}</td>
     <td>{{item.name}}</td>
  </tr>
</tbody>

当前回答

有点晚了,但我最近遇到了这种情况。这个答案没有解决我的问题。

我的前提

我在项目中使用了自定义目录结构。有问题的组件位于components目录中。 我发现类似错误的组件是使用CLI原理图和——skip-import选项创建的 NPX ng g c——skip-import ../components/my-component

解决方案

因为我使用了——skip-import(见注释)选项,我发现我的组件没有添加到模块中的declarations数组中。将组件添加到相同的组件中解决了这个问题。

注意:如果没有这个,你就不能在app目录外创建组件。

其他回答

如果你已经采用了(BrowserModule, CommonModule, FormsModule) 它仍然没有工作

然后,您所要做的就是检查模块中是否声明了有错误的组件

我遇到过类似的错误(*ngIf),即使我所有的导入都是OK的,并且组件呈现时没有任何其他错误+路由是OK的。

在我的例子中,AppModule没有包含这个特定的模块。奇怪的是,它并没有抱怨这一点,但这可能与Ivy使用ng serve的方式有关(类似于根据路由加载模块,但不考虑它的依赖关系)。

通过在其他(新/自定义)模块中导入CommonModule,许多答案似乎趋于一致。 这一步在所有情况下都是不够的。

完整的解决方案分为两步:

让NgIf, NgFor等指令对你的项目可见。 在主组件中以正确的方式重新组装所有内容

点1 主模块中的BrowserModule似乎足够访问NgFor了。 Angular文档把它写在这里:。

CommonModule用于导出所有基本的Angular指令和管道,比如NgIf、NgForOf、DecimalPipe等等。由BrowserModule重新导出,

参见此处接受的答案:CommonModule vs BrowserModule

点2 唯一需要改变的是(在我的情况下)如下:

导入模块 导入组件 Ng构建(重要!) ng服务

app.module.ts

@NgModule({
    imports: [
        BrowserModule,
        OtherModule
    ],
    declarations: [OtherComponent, AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule {
}

other.html

<div *ngFor='let o of others;'> 
</div>

other.component.ts

@Component({
    selector: 'other-component',
    templateUrl: './other.html'
})
export class OtherComponent {
}

app.module.ts

@NgModule({
    imports: [],
    providers: []
})
export class OtherModule{
}

我有同样的错误,但我有CommonModule导入。相反,我在不应该的地方留下了逗号,因为在分割模块时需要复制/粘贴:

@NgModule({
    declarations: [
        ShopComponent,
        ShoppingEditComponent
    ],
    imports: [
        CommonModule,
        FormsModule,
        RouterModule.forChild([
            { path: 'shop', component: ShopComponent }, <--- offensive comma
        ])
    ]
})

我也有同样的问题,即使我已经在“module”中导入了“BrowserModule”和“CommonModule”。它没有工作,我的错误是,没有添加“NgModule.declarations”我的组件。

@NgModule ({
   declarations: [
     Your_Component // here
   ]
})