ngFor角度2を使用してオブジェクトの配列内に配列を表示する方法

Question

オブジェクトの配列内にある配列の品質を表示する必要があります。以下のコードを使用してngForに電話してみました。 ngForの私の使用に何か問題がありますか？

import { Component} from '@angular/core'; 

@Component({ 
    selector: 'my-app', 
    template: `<table> 
        <thead> 
        <tr> 
         <th>Name</th> 
         <th>Quality1</th> 
         <th>Quality2</th> 
        </tr> 
        </thead> 
        <tbody> 
         <tr *ngFor"let item of people"> 
         <td>{{item.Name}}</td> 
         <td *ngFor"let item of people.quality">item.quality1</td> 
         <td *ngFor"let item of people.quality">item.quality2/td> 
         </tr> 
        </tbody> 
       </table> 
    }) 

    export class AppComponent{  
    people: any = [{Name:"John", quality:[{quality1: "nice", quality2: "humble"}]}, {Name:"Dave", quality:[{quality1: "kind", quality2: "caring"}]} ]; 
    } 

現在のところ、名前のみが表に表示されていますが、品質も表示したいと思います。

Answer 1

あなたはDOMに別の要素を導入することなく*ngForで複数のノードを結合する<ng-container>を使用することができます。

<ng-container *ngFor"let item of people.quality"> 
    <td>item.quality1</td> 
    <td>item.quality2/td> 
</ng-container> 

Answer 2

私はあなたによく理解していれば、あなたもそのように結合することができる：

    <tr *ngFor="let item of people"> 
        <td>{{item.Name}}</td> 
        <td *ngFor="let item of people.quality">{{item.quality.[quality1]}}</td> 
        <td *ngFor="let item of people.quality">{{item..quality.[quality2]}}</td> 
        </tr>