Laufzeitbindung in Angular 4

Question

Hallo, ich bin neu entwickelnde Angular-Anwendung. Aber, ich möchte eine html select Element Option Anzeige in der Laufzeit zu binden, werfen Sie einen Blick auf meinen Code. Ich verwende TypeScript. Ich habe diese Klasse.

export class Gender{ 
constructor(short:string, long:string){ 
    this.shortName = short; 
    this.longName = long; 
} 
shortName:string; 
longName:string; 

}

Dass ich wie dies

<select class="form-control" [(ngModel)]="selectedOption"> 
     <option *ngFor="let opt of options" [ngValue]="opt"> 
      {{opt."DYNAMICALLY INSERT THE NAME OF THE FIELD TO DISPLAY"}} 
     </option> 
    </select> 

ich in Laufzeit definieren will zu binden bin versucht, die Feldanzeige sein. Lassen Sie uns sagen, dass ich so etwas wie dieses

<select class="form-control" [(ngModel)]="selectedOption"> 
     <option *ngFor="let opt of options" [ngValue]="opt"> 
      {{opt.WHICHFIELDTODISPLAY}} 
     </option> 
    </select> 

so im valriable WHICHFIELDTODISPLAY ist der Name des Feldes Ich möchte angezeigt werden tun wollen sagen wir mal „Longname“.

Also, wie binde ich einen dynamischen Wert in einem Select-Option-Element mit Angular 4 mit TypeScript?

Answer 1

können Sie versuchen, den Wert Platzierung innerhalb [] statt dot operator

<option *ngFor="let opt of options" [ngValue]="opt"> 
      {{opt[WHICHFIELDTODISPLAY]}} 
</option>