角度デフォルトの選択オプション

Question

これは私のhtmlです：

<select 
    [(ngModel)]="serverSelected" 

    name="serverSelected" 
    (change)="onServerSelect()" 
    class="custom-select mb-2 col-md-4 col-12 mr-sm-2 mb-sm-0" 
    > 
    <option *ngFor="let server of servers" [ngValue]="server">{{server.display_name}}</option> 
    </select> 

マイserver.component.ts：

ngOnInit(){ 
    this.getServers(); 
    this.getServerPackages(1); 
    this.getServerCategories(1); 
} 
onServerSelect(serverSelected){ 
    console.log(this.serverSelected.display_name); 
    this.getServerPackages(this.serverSelected.id); 
    this.getServerCategories(this.serverSelected.id); 
} 
getServers(){ 
    this.serverService.getServers().subscribe(response => { 
    this.servers = response; 
    console.log(response); 
    }); 
} 

そして、私の問題は、私の選択ボックスでデフォルトのオプションを設定する方法です。サーバー配列の最初の要素を選択したいとしましょう。

Answer 1

あなたは、次の操作を行うことができます - あなたの応答からserverSelectedデフォルト値を割り当てる：

getServers(){ 
    this.serverService.getServers().subscribe(response => { 
    this.servers = response; 
    this.serverSelected = response[0]; // set the selected option to the first of the array 
    console.log(response); 
    }); 
}