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

Question

我看到另一个关于同一问题的问题，但我不知道为什么会出现此错误。 奇怪的是，我做了另一个组件，它返回一个数组并且工作正常，现在我创建了这个新组件，但它不起作用。

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

这是我的组件订阅客户组件：

    public subscriptions:Subscription[];

constructor(private subscriptionService:CustumerSubscriptionService){} 

ngOnInit(): void {

        this.subscriptionService.getsubscriptionbyID(this.userid)
        .subscribe(res=>this.subscriptions=res,
            error=> this.errorMessage);
    
}

这页纸：

    <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> 

订阅模块：

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{}

和主模块 AppModule：

@NgModule({
  declarations: [
    AppComponent

  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    NavegacaoModule,
    NgbModule,
    ToastrModule.forRoot(),
    HttpClientModule
  ],
  providers: [httpInterceptorProviders],
  bootstrap: [AppComponent]
})
export class AppModule { }

Answer 1

仔细检查您的服务返回的内容。 最有可能的是：

this.subscriptions=res

不是数组。 对此最可能的解释是您返回的是基于 this.userid 的单个记录，而不是数组。

尝试console.log(this.subscriptions)看看它是什么。 如果它不是数组，您将收到该错误。

Answer 2

你告诉你的组件叫做SubscriptionCustumerComponent ，但是它没有在SubscriptionModule中声明。 相反，我们有CustumerSubscriptionAppComponent 。 这可能是一个问题，因为所有其他内容（包括浏览器模块和公共模块）似乎都是正确的。