错误 Angular 13：ngForOf 未被任何指令使用...无法绑定到“ngForOf”

Question

我收到了这个错误

Property binding ngForOf 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". > 

无法绑定到“ngForOf”，因为它不是“a”的已知属性

我已经导入了所有必要的模块：CommonModule、BrowserModule、ReactiveFormsModule

app.module.ts：

import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { RecipesComponent } from './components/recipes/recipes.component';
import { RecipeListComponent } from './components/recipes/recipe-list/recipe-list.component';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { CommonModule } from '@angular/common';

@NgModule({
  declarations: [
    AppComponent,
    HeaderComponent,
    RecipesComponent,
    RecipeListComponent,
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    ReactiveFormsModule,
    CommonModule,
  ],
  providers: [],
  bootstrap: [AppComponent],
  schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class AppModule { }

recipe-list.component.ts ：

<div class="row">
  <div class="col-xs-12">
    <a href="#" class="list-group-item clearfix" *ngFor="let recipe of recipes"> // error ngFor
      <div class="pull-left">
        <h4 class="list-group-item-heading"> {{ recipe.name}} </h4>
      </div>
      <span class="pull-right">
        <img [src]="recipe.imagePath" alt=" {{recipe.name}} " srcset="" class="img-responsive" style="max-height: 50px">
      </span>
    </a>
    <app-recipe-item></app-recipe-item>
  </div>
</div>

我正在使用 Angular v13.1.1 / Node v16.13.1 / VSCode v1.63.2

Answer 1

禁用 Visual Studio 扩展“Angular 语言服务”解决了这个问题。