Question

当用户登录我的应用时，它会加载他们正在使用的先前的UI设置。要在接口之间切换，有一个下拉列表，列出了特定用户有权使用的所有选项。

我希望该列表中的所选选项能够反映页面加载时的上一个用户界面，但我在如何设置所选<option>

时遇到问题

以下是一些示例代码：

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

HTML：

<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>

在Angular2中，如何在选项上设置selected参数以反映user.previousUI？

我尝试添加这个：

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

但这似乎并没有。

Answer 1

一种方法是

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

Angular2 ngFor - 设置已选中

1 个答案: