使用嵌套ngFor的Angular 2 [英] Angular 2 using nested ngFor
本文介绍了使用嵌套ngFor的Angular 2的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
使用以下代码时出现此错误:
I get this error when using the below code:
找不到类型为对象"的其他支持对象"[对象对象]".
Cannot find a differ supporting object '[object Object]' of type 'object'.
做嵌套的ngFor时,有什么方法可以解决此问题?
Is there any way to workaround this problem when doing nested 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
内部,因此应该是:
Your top level iteration is wrong, the array you want to iterate is inside members.members
, so it should be:
<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>
这篇关于使用嵌套ngFor的Angular 2的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文