Hello {{ name }} Error: NG0303: Can'" /> Hello {{ name }} Error: NG0303: Can'" /> Hello {{ name }} Error: NG0303: Can'"/>

Angular 17 error: Can't bind to 'ngForOf' since it isn't a known property of 'li'

694 views Asked by At

Here is the code that is throwing error: user-list.component.html:

<ul>
    <li *ngFor="let name of names">Hello {{ name }}</li>
</ul> 

Error:

NG0303: Can't bind to 'ngForOf' since it isn't a known property of 'li' (used in the '_UserListComponent' component template).
1. If 'li' is an Angular component and it has the 'ngForOf' input, then verify that it is included in the '@Component.imports' of this component.
2. To allow any property add 'NO_ERRORS_SCHEMA' to the '@Component.schemas' of this component.      
NG0303: Can't bind to 'ngForOf' since it isn't a known property of 'li' (used in the '_UserListComponent' component template).
1. If 'li' is an Angular component and it has the 'ngForOf' input, then verify that it is included in the '@Component.imports' of this component.
2. To allow any property add 'NO_ERRORS_SCHEMA' to the '@Component.schemas' of this component.

While app.component.ts :

import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterOutlet } from '@angular/router';
import { HelloWorldComponent } from './hello-world/hello-world/hello-world.component';
import { UserItemComponent } from './user-item/user-item.component';
import { UserListComponent } from './user-list/user-list.component';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [CommonModule, RouterOutlet, HelloWorldComponent,UserItemComponent, UserListComponent],
  templateUrl: './app.component.html',
  styleUrl: './app.component.css'
})
export class AppComponent {
  title = 'app1';
}

Where is the problem as i imported common module ?!

1

There are 1 answers

2
Matthieu Riegler On

If you're using standalone:true you need to import NgFor or Common module in you UserListComponent