I saw another question about the same problem, but I don’t know why I get this error.
The odd thing here is that I did another component that returns a array and works fine, now I’ve created this new one but it doesn’t work.
Can’t bind to ‘ngForOf’ since it isn’t a known property of ‘li’
this is my component SubscriptionCustumerComponent:
public subscriptions:Subscription[];
constructor(private subscriptionService:CustumerSubscriptionService){}
ngOnInit(): void {
this.subscriptionService.getsubscriptionbyID(this.userid)
.subscribe(res=>this.subscriptions=res,
error=> this.errorMessage);
}
the page:
<ul class="nav">
<li *ngFor="let data of subscriptions" >
<div class="card">
<img src="{{data.image}}" style="width:100%;height:250px;">
<h1>{{data.name}}</h1>
</div>
</li>
</ul>
the SubscriptionModule:
import { CommonModule } from "@angular/common";
import { NgModule } from "@angular/core";
import { CustumerSubscriptionService } from "./service/subscription.service";
import { CustumerSubscriptionAppComponent } from "./subscription.app.component";
import { CustumerSubscriptioRoutingModule } from "./subscription.route";
@NgModule({
declarations:[
CustumerSubscriptionAppComponent
],
imports:[
CommonModule,
CustumerSubscriptioRoutingModule
],
providers:[
CustumerSubscriptionService
]
})
export class CustumerSubscriptionModule{}
and the main Module AppModule:
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
AppRoutingModule,
BrowserAnimationsModule,
NavegacaoModule,
NgbModule,
ToastrModule.forRoot(),
HttpClientModule
],
providers: [httpInterceptorProviders],
bootstrap: [AppComponent]
})
export class AppModule { }
double check what your service is returning. Most likely this:
Is not an array. And the most likely explanation for this is that you are returning a single record based on this.userid, instead of an array.
try to
console.log(this.subscriptions)
to see what it is. If it’s not an array, you will get that error.