如何按照角度2中的以下要求实现下拉菜单

时间:2017-08-18 06:46:32

标签: html angular

默认情况下,我想在下拉列表中设置值:{{getTeamName(employee.team)}}并绑定{{team.$value}}的值。

<div class="form-group">
    <label for="team">Designation</label>
    <select [(ngModel)]="selectedValue" [ngModelOptions]={standalone:true}">
        <option *ngFor="let team of teams">{{team.$value}}</option>
    </select>
</div>

功能:

getTeamName(key) {
    let result = this.teams.filter(item => item.$key == key);
    if (result.length > 0) {
        return result[0].$value;
    }
    return '';
}

2 个答案:

答案 0 :(得分:0)

您可以直接考虑将emplyee.team绑定到预先填充team中的ngModel对象。在选项级别使用team下拉列表中填充[ngValue]="team"值。不确定team.$value是什么,我假设您要显示team.name

<div class="form-group">
   <label for="team">Designation</label>
   <select [(ngModel)]="employee.team" [ngModelOptions]={standalone:true}">
       <option [ngValue] *ngFor="let team of teams">{{team.name}}</option>
   </select>
</div>

答案 1 :(得分:0)

  <select [(ngModel)]="employee.team" [ngModelOptions]="{standalone: true}">
      <option *ngFor="let team of teams"  [value]="team.$key" [selected]="employee.team == team.$key" >{{team.$value}}</option>
  </select>