Angular2 *ngFor in select list, set active based on string from object
This should work
<option *ngFor="let title of titleArray" [value]="title.Value" [attr.selected]="passenger.Title==title.Text ? true : null"> {{title.Text}}</option>
I'm not sure the attr.
part is necessary.
Check it out in this demo fiddle, go ahead and change the dropdown or default values in the code.
Setting the passenger.Title
with a value that equals to a title.Value
should work.
View:
<select [(ngModel)]="passenger.Title"> <option *ngFor="let title of titleArray" [value]="title.Value"> {{title.Text}} </option></select>
TypeScript used:
class Passenger { constructor(public Title: string) { };}class ValueAndText { constructor(public Value: string, public Text: string) { }}...export class AppComponent { passenger: Passenger = new Passenger("Lord"); titleArray: ValueAndText[] = [new ValueAndText("Mister", "Mister-Text"), new ValueAndText("Lord", "Lord-Text")];}