Wie wählt man/init den ersten Wert in html Wählen Sie die Option, nachdem die Daten durch angular 2 Observable geladen wurden?

Question

Ich habe eine html mit Optionen auswählen, die wie folgt aussieht:

<select [(ngModel)]="role" (ngModelChange)="roleChanged($event)"> 
    <option *ngFor="#role of roles" [ngValue]="role">{{role.Name}}</option> 
</select> 

Rollen [] werden zugewiesen in einer Zeichnung eines beobachtbaren von meinem Service. Alles funktioniert gut, außer dass die Auswahl anfänglich leer ist, auch nachdem die Rollen [] geladen wurden. Ich möchte, dass die Auswahlliste die erste Option sofort anzeigt, wenn Rollen [] vom Dienst geladen werden. Und dann ändert sich auch die "Rolle".

Ich denke entweder mit ngInit auf die Auswahl oder die Option, aber es scheint nicht zu funktionieren. Ich habe auch darüber nachgedacht, eine Rolle in der Komponente zuzuweisen, nachdem das Observable zurückgegeben wurde, aber ich kann das nicht herausfinden/weiß, ob das möglich ist, weil Rollen [0] immer Null ist, bevor roles [] geladen wird.

Hier ist der Code abonnieren, wenn das wichtig ist:

getDivisonTeamRoles() { 
this._divisonProposalService.getDivisionTeamRoles() 
       .subscribe(
        roles => this.roles = roles, 
        error => this.errorMessage = <any>error); 

}

Answer 1

ich es herausgefunden. In der Funktion subscribe() können Sie dort mehrere Codezeilen hinzufügen und Funktionen aufrufen, andere Variablen zuweisen usw. So ähnlich ..

.subscribe(
        roles => { 
        this.roles = roles; 
        this.role = this.roles[0]; 
        this.getEmployeesByRole(); 
        }, 
        error => this.errorMessage = <any>error);