Wie benutze ngFor um zwei Array zu holen

Question

Ich bin neu in Angular2. Ich möchte zwei Array in einem li holen wie unten:

[array1] in [array2]

zum Beispiel, ich habe zwei Arrays, die erste für Namen und die zweite für Alter und ich haben will eine Ausgabe wie folgt aus:
Name in Alter

und auch weiß ich, dass es möglich ist, ein 2D-Array für diese zu verwenden, aber ich will nicht. Ich würde gerne wissen, was ist mit ngFor möglich?

es ist mein Eckige Code:

@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"]; 
} 

und ich möchte ein Ergebnis wie folgt aus (aber ohne Format in Arrays zu ändern)

N1 in 20 Jahren

N2 in 15 Jahren

N3 in 37 Alter

Answer 1

Try this:

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

Answer 2

Das sieht eher wie ein Datenmodellierungsproblem für mich aus.

Ich würde Ihnen vorschlagen, beide Arrays in eine mit der folgenden Person Schnittstelle zu fusionieren:

{ name: string, age: number } 

So Ihr Array eine Art von Person haben würde []. Dann in Ihrer Vorlage können Sie die Strukturrichtlinie * ngFor wie folgt verwendet werden:

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