2016-05-11 6 views
1

ユーザーが自分のアプリにログインすると、以前使用していたUI設定が読み込まれます。インターフェイスを切り替えるには、特定のユーザーが使用を許可されているすべてのオプションを一覧表示するドロップダウンがあります。Angular2 ngFor - selectedが選択されました

私は、ページがロードされたときに、以前のUIを反映するために、そのリスト内で選択されたオプションをしたいと思いますが、私はここで選択した<option>

を設定する方法を考え出すのトラブルを抱えているが、いくつかのサンプルコードです:

//User object from DB 
var user = { 
    username: admin, 
    previousUI: 'Build', 
    authorizedUI: [{title:'Default'}, {title:'Edit'}, {title:'Build'}] 
} 

HTML:Angular2で

<form class="navbar-form"> 
    <label>System: </label> 
    <select (change)="systemSelect($event.target.value)"> 
    <option *ngFor="let system of user.authorizedUI" [value]="system.title"> 
     {{system.title}} 
    </option> 
    </select> 
</form> 

私はを反映するために、オプションでselectedパラメータを設定するのですか?

私はこれを追加してみました:

<option *ngFor="let system of user.authorizedUI" [value]="system.title" [selected]="system.title === user.previousUI"> 

しかし、それを行うには思えなかったという。

答えて

2

一つの方法は、トリックをした

<select [ngModel]="user?.previousUI" (change)="systemSelect($event.target.value)"> 
+0

だろう!早速のお返事ありがとうございます! – BrentShanahan

関連する問題