无法绑定到“ ngForOf”,因为它不是“ li” Angular 9的已知属性

时间:2020-04-05 23:14:04

标签: angular angular9

这个问题在这里已经被问过多次,在经过足够的解决方案后,我在这里求职,因为确保我的子模块中有CommonModule并在app.module中有BrowserModule的常见解决方案.ts无法正常工作。

HTML子模块

<div class="container bg-success">
  hi  <---- this works just fine
</div>
<ul>
  <li *ngFor="let product of products">
    <h2>{{ product.name }} ${{ product.id}}</h2>
  </li>
</ul>

子模块中的组件

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-child-component',
  templateUrl: './child-component.component.html',
  styleUrls: ['./child-component.component.css'],
})
export class ChildComponent implements OnInit {
  constructor() {}

  products = [
    {
      id: 1,
      name: 'Licensed Frozen Hat',
    },
  ];

  ngOnInit(): void {}
}

子模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ChildComponent} from './components/child-component.component';

@NgModule({
  declarations: [ChildComponent],
  imports: [CommonModule],
})
export class ChildModule {}

应用模块

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { ConfigurationModule } from './modules/configuration/configuration.module';

@NgModule({
  declarations: [AppComponent],
  imports: [
    NgbModule,
    BrowserModule,
    AppRoutingModule,
    ConfigurationModule,
    HttpClientModule,
  ],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {}

1 个答案:

答案 0 :(得分:0)

正如Eliya Cohen在上面的评论中提到的,重新运行ng为我修复了它。保持这种情况以防有人碰到。