ngForを使用して2つの配列を取得する方法

Question

私はAngular2で新しくなっています。私は、蛇腹のようリチウム二つの配列を取得したい：

例えば

[配列1]に[配列2]

、Iは、2つのアレイ、年齢の名前と第二の最初を有し、私がしたいです年齢

で
名とも私はこのために2次元配列を使用することが可能だということを知っているが、私はしたくない。このような出力。 ngForでどちらが可能か知りたいですか？

それは私の角度コードです：

@Component({ 
    selector:'peaple', 
    template: ` 
     <h2>{{title}}</h2> 
     <ul> 
      <li *ngFor="#name of names"> 
       {{name}} in {{ages}} age 
      </li> 
     </ul> 
     ` 
}) 
export class PeapleComponent{ 
    title = "Example"; 
    Names =["N1","N2","N3"]; 
    Ages=["20","15","37"]; 
} 

と私はこのような結果を望む15歳

をして

N2 20歳で

N1（ただし、配列形式に変更せずに） 37歳でのN3

Answer 1

はこれを試してみてください：

<ul> 
     <li *ngFor="let i of Names; let k = index"> 
     {{i}} in {{Ages[k]}} age 
     </li> 
    </ul> 

Answer 2

これは、私にとってデータモデリングの問題と思われます。

私は次の人のインタフェースで一つに両方の配列をマージするためにあなたを示唆しているであろう：

{ name: string, age: number } 

だからあなたの配列は[]タイプの人を持っているでしょう。次に、あなたのテンプレートで、あなたは次のように構造的なディレクティブ* ngForを使用することができます。

<li *ngFor="let person of array"> 
    {{person.name}} is {{person.age}} year old 
</li>