0

I would like to use ngFor and ngIf insie the template load dynamic.

I used this tutorel by angular.io to load my dynamic template : here

I have app.module :

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [ 
      BrowserModule,
      AppRoutingModule, 


  ],
  providers: [
  ],
   })
 export class AppModule { }  

My second module :

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
@NgModule({
  imports: [
    CommonModule,
  ],
  providers: [

  ],
  entryComponents: [
    Template1Component,
    Template2Component,
    Template3Component,
  ],
  declarations: [
    Template1Component,
    Template2Component,
    Template3Component,

  ]
})
export class MyModule { }

the link between appModule and my module by appRoutingModule :

const appRoutes: Routes = [

  { path: 'site', loadChildren: '../myModule.module#MyModule' },
  { path: '**', component: PageNotFoundComponent },
];
export const AppRoutingModule = RouterModule.forRoot(appRoutes);

my template 1 have that :

  <ul>
    <li *ngfor="let specialite of specialites">
      {{specialite.nam}}
    </li>
  </ul>

everything work but when I use ngfor I have this error :

ERROR Error: Uncaught (in promise): Error: Template parse errors:
Can't bind to 'ngforOf' since it isn't a known property of 'li'. ("

          <ul>
            <li [ERROR ->]*ngfor="let specialite of specialites">
              {{specialite.nam}}
            </li>
"): ng:// ........
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".
Cœur
  • 37,241
  • 25
  • 195
  • 267
Viet47
  • 81
  • 1
  • 1
  • 6

0 Answers0