[英]Angular 2 using nested ngFor
使用以下代碼時出現此錯誤:
找不到'對象'類型的不同支持對象'[object Object]'。
在進行嵌套的ngFor時,有沒有辦法解決這個問題?
import { Component,OnInit } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<div id="results">
<div *ngFor="let mem of members">
{{mem.id}}
<div class="card-container">
<div *ngFor="let case of mem.cases">
{{case.id}}
</div>
</div>
</div>
</div>
`,
})
export class AppComponent implements OnInit {
public members = { "members": [
{ "name" : "Ana", "id" : "001",
"cases" : [
{"id" : "992", "casenumber" : "882"},
{"id" : "242", "casenumber" : "344"},
]} ,
{ "name" : "Ina", "id" : "002",
"cases" : [
{"id" : "532", "casenumber" : "234"},
{"id" : "734", "casenumber" : "346"},
]} ,
{ "name" : "Ora", "id" : "003",
"cases" : [
{"id" : "235", "casenumber" : "974"},
{"id" : "458", "casenumber" : "125"},
]}
]
}
ngOnInit(){
console.log(this.members);
}
}
你的頂級迭代是錯誤的,你要迭代的數組是在members.members
,所以它應該是:
<div *ngFor="let mem of members.members"> // here
{{mem.id}}
<div class="card-container">
<div *ngFor="let case of mem.cases">
{{case.id}}
</div>
</div>
</div>
你遍歷一個objet而不是一個數組,所以你應該通過以下方式指向該數組:
<div *ngFor="let mem of members.members">
更改
<div *ngFor="let mem of members">
至
<div *ngFor="let mem of members.members">
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.