Implementierung Dropdown in Angular2

Question

Gibt es einen besseren Weg, um ein Drop-down in Angular2

ich folgende

In der Vorlage tue zu implementieren

<select (change)="onSelect($event.target.value)"> 
         <option *ngFor="#taskstatus of dropdownValues" [value]="taskstatus.value">{{taskstatus.name}}</option> 
</select> 

In der Komponentenklasse

export class CreateTaskComponent { 

    public selectedStatus: Taskstatus = this.dropdownValues[0]; 
    public dropdownValues: Taskstatus[] = [ 
     {"name":"OPEN","value":"OPEN"}, 
     {"name":"CLOSED","value":"CLOSED"} 
    ]; 

    onSelect(taskevent) { 
     this.selectedStatus = null; 
     for (var i = 0; i < this.dropdownValues.length; i++) 
     { 
      if (this.dropdownValues[i].value == taskevent) { 
      this.selectedStatus = this.dropdownValues[i]; 
      console.log(this.selectedStatus.value); 
      } 
     } 
    } 
} 

class Taskstatus{ 
    name: string; 
    value: string; 
}  

Gibt es einen einfacheren Ansatz dazu?

Answer 1

Verwenden ngModel und ngValue wie:

<select [(ngModel)]="selectedStatus"> 
    <option *ngFor="#taskstatus of dropdownValues" [ngValue]="taskstatus">{{taskstatus.name}}</option> 
</select>