无法绑定到“ngForOf”，因为它不是“tr”的已知属性（最终版本）

如果是根模块 (AppModule)，则将 BrowserModule 添加到 @NgModule() 中的 imports: []，否则添加 CommonModule。

// older Angular versions
// import {BrowserModule, CommonModule} from '@angular/common';

import { BrowserModule } from '@angular/platform-browser'
..
..
@NgModule({
  imports: [BrowserModule, /* or CommonModule */],
  ..
})

---

就我而言，问题在于我的队友在模板中提到了 *ngfor 而不是 *ngFor。奇怪的是没有正确的错误来处理这个问题（在 Angular 4 中）。

---

您必须在使用这些内置指令（如 ngFor、ngIf 等）的模块中导入 CommonModule。

import { CommonModule } from '@angular/common'
       
@NgModule({
    imports: [
        CommonModule
    ]
})
    
export class ProductModule { }

---

可能有任何原因：

您的模块在 imports[] 中没有 CommonModule 您使用 *ngFor 或 *ngIf 的组件不是任何模块的一部分。您可能在 *ngFor 中出现拼写错误，即 **ngFor 或 *ngfor 等。如果一切正常，请重新启动您的应用程序，即 ng serve 或 IDE，即 VS Code、IntelliJ 等。

---

对我来说，问题是我没有在我的 app.module.ts 中导入定制模块 HouseModule。我有其他进口。

文件：app.module.ts

import { HouseModule } from './Modules/house/house.module';

@NgModule({
  imports: [
    HouseModule
  ]
})

---

如果您没有在功能模块中声明路由组件，也会发生这种情况。例如：

feature.routing.module.ts：

...
    {
        path: '',
        component: ViewComponent,
    }
...

功能模块.ts：

     imports: [ FeatureRoutingModule ],
     declarations: [],

注意 ViewComponent 不在声明数组中，而它应该在。

---

要记住的事情：

当使用自定义模块（AppModule 以外的模块）时，需要在其中导入通用模块。

yourmodule.module.ts

import { CommonModule } from '@angular/common';

@NgModule({
  imports: [
    CommonModule
  ],
  exports:[ ],
  declarations: []
})

---

我收到错误是因为我使用的组件未在声明中注册：模块的 [] 部分。

添加组件后，错误消失了。我希望有一些比这个错误消息更隐蔽的东西来表明真正的问题。

---

未来的读者

检查以下各项：

该组件在 SINGLE 角度模块中声明确保您已 import { CommonModule } from '@angular/common';重新启动 IDE/编辑器 重新启动开发服务器 (ng serve)

---

我遇到了同样的错误，您可以通过以下方法之一修复：

如果您没有任何嵌套模块在您的 App 模块中导入 CommonModule b。在应用模块中添加 *ngFor 的位置导入组件，在声明中定义

// file App.modules.ts
@NgModule({
  declarations: [
    LoginComponent // declarations of your component
  ],
  imports: [
    BrowserModule
    DemoMaterialModule,
    FormsModule,
    HttpClientModule,
    ReactiveFormsModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production })
  ],
  providers: [
    ApiService, 
    CookieService, 
    {
      provide: HTTP_INTERCEPTORS,
      useClass: ApiInterceptor,
      multi: true
    }
  ],
  bootstrap: [AppComponent]
})

C。如果您使用单独的模块文件进行路由，则在您的路由模块中导入 CommonModule 否则在您的 App 模块中导入 CommonModule

// file app.routing.modules.ts
import { LoginComponent } from './login/login.component';
import { CommonModule } from "@angular/common";

const routes: Routes = [
  { path: '', component: LoginComponent },
  { path: 'login', component: LoginComponent }
];

@NgModule({
  imports: [RouterModule,RouterModule.forRoot(routes), CommonModule],
  exports: [RouterModule]
})

如果您有嵌套模块，则在该特定模块中执行第一步

就我而言，第二种方法解决了我的问题。希望对你有帮助

---

如果您正在制作自己的模块，则在您自己的模块中的导入中添加 CommonModule

---

将组件添加到您的 app.module

import { ModalComponent } from './modal/modal.component';

@NgModule({
  declarations: [ModalComponent],
  entryComponents: [ModalComponent],
  
  }),
  providers: [
  ],
  bootstrap: [AppComponent]
})

---

对于 Angular 10：

将 BrowserModule 添加到路由模块的导入中。确保您将不起作用的组件添加到应用程序模块声明中。

未能执行第 2 步将触发此错误！

确保重新启动服务！

---

万一有人在尝试导入 CommonModule 后仍然遇到错误，请尝试重新启动服务器。它令人惊讶地工作

---

所以请确保

指令中没有语法错误浏览器（在应用程序模块中）和通用（在其他/子）模块已导入（与上面提到的 Günter Zöchbauer 相同）如果您在应用程序中有路由，则应在应用程序模块中导入路由模块所有路由组件的Module也在App Module中导入，例如：app-routing.module.ts如下： const routes: Routes = [ {path: '', component: CustomerComponent}, {path: 'admin', component: AdminComponent } ];

然后 App 模块必须在 @NgModule() 中导入 CustomerComponent 和 AdminComponent 模块。

---

通过在其他（新/自定义）模块中导入 CommonModule，许多答案似乎都收敛了。
仅此步骤在所有情况下都不够。

完整的解决方案包括两个步骤：

使指令 NgIf、NgFor 等对您的项目可见。在主组件（app.module.ts）中以正确的方式重新组装所有内容

第 1 点
主模块中的 BrowserModule 似乎足以访问 NgFor。 Angular Documentation 站在这里：.

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

另请参阅此处接受的答案：CommonModule vs BrowserModule in angular

第 2 点唯一需要的更改（在我的情况下）如下：

import Module OtherModule import Component OtherComponent ng build（重要！）ng serve

app.module.ts

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

其他.html

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

其他.component.ts

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

app.module.ts

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

---

在您的所有代码中使用正确的语法后，请查看您是否在 Angular 模块的声明中提到了您的组件。如下所示：

@NgModule({ 声明：[ AppComponent, YourComponent ],

---

我遇到了同样的问题，即使我在“module.ts”中导入了“BrowserModule”和“CommonModule”，它也不起作用，我的错误是，没有在“NgModule.declarations”中添加我的组件。

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

---

我有同样的错误，但我导入了 CommonModule。相反，我在拆分模块时因为复制/粘贴而留下了一个逗号：

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

---

app.module.ts 修复并更改为：在您的应用模块中导入 BrowserModule

import { BrowserModule } from '@angular/platform-browser';

@NgModule({
  declarations: [
    AppComponent    
  ],
  imports: [
    BrowserModule, 
  ],     
  providers: [],
  bootstrap: [AppComponent]
})

---

即使我的所有导入都正常并且组件在没有任何其他错误的情况下呈现 + 路由正常，我也遇到了类似的错误 (*ngIf)。

在我的情况下，AppModule 不包括该特定模块。奇怪的是它没有抱怨这一点，但这可能与 Ivy 与 ng serve 的工作方式有关（根据路由加载模块，但不考虑其依赖关系）。

---

自定义模块 需要通用模块

import { CommonModule } from "@angular/common";


@NgModule({
  imports: [
    CommonModule
  ]
})

---

如果您已经使用（BrowserModule、CommonModule、FormsModule）并且它仍然无法正常工作

那么您所要做的就是检查是否在模块中声明了有错误的组件

---

当使用“app-routing.module”时，我们忘记了导入“CommonModule”。记得导入！

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

---

我开始使用 Angular8 基础实时项目时遇到了上述问题，但是当使用“app-routing.module”时，我们忘记了导入“CommonModule”。记得导入！

import { CommonModule } from '@angular/common';

@NgModule({
  imports: [
    CommonModule
]})

它将解决您的错误。

---

我有一个问题是因为 ** 而不是 *

*ngFor="let ingredient of ingredients"

**ngFor="let ingredient of ingredients"

---

为了将来参考，我正在对 Angular 12 进行一些单元测试并遇到了这个问题。

我的问题是我正在使用 ng 引导库并测试一种使用 NgbModal 创建新模式的方法。

我收到这些警告是因为我忘记导入由弹出窗口创建的组件。

我不需要导入 FormsModule、CommonModule 或 BrowserModule。

因此，如果您遇到这些错误，请确保您尝试创建实例的组件已在导入中列出。

---

如果你有模块实现，那么你必须导入组件并在声明中设置组件

https://i.stack.imgur.com/jXu6c.png

祝你编码好运:)

---

在修改了几个组件后遇到了同样的问题。没有语法错误并且所有模块都已导入，但重新启动服务器解决了该问题。错误发生在一个组件中，该组件是在几十个成功提交之前添加的。

以防万一其他人遇到同样的问题。

---

我认为我的情况很少见，但无论如何我都会回答。

我没有任何语法错误，我导入了 BrowserModule，我重述了我的 IDE（VS Code），但我的模板中仍然出现红线，因为我使用了 *ngFor。

我碰巧是因为我使用了扩展程序 Angular Language Service，但它已经很旧了。更新后，错误停止出现。

https://i.stack.imgur.com/0yjUh.png

---