2017-05-03 19 views
11

नेस्ट का उपयोग करते समय नीचे दिए गए कोड का उपयोग कर मैं इस त्रुटि मिलती है:कोणीय 2 ngFor

एक वस्तु का समर्थन प्रकार 'वस्तु' के '[वस्तु वस्तु]' अलग नहीं मिल सकी।

क्या नेस्टेड 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); 
    } 
} 

उत्तर

15

आपका शीर्ष स्तर यात्रा गलत है, सरणी आप पुनरावृति करना चाहते हैं अंदर 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> 
2

परिवर्तन

<div *ngFor="let mem of members"> 

को
<div *ngFor="let mem of members.members"> 
3

आप एक पर लूप n objet एक सरणी नहीं है, इसलिए आपको उस सरणी को स्विटिच करके इंगित करना चाहिए:

<div *ngFor="let mem of members.members"> 
संबंधित मुद्दे