Question

在此下拉列表中，我的mat-select下拉列表在我选择任何用户时都具有多个用户，我想显示此选定的用户名，但是在ngModel中，我有userObject.userid，我不想更改显示名称的方式任何选定的用户。

chat.component.html

<mat-form-field style="width: 25%;margin-top: 20px;margin-left: 20px;">
  <mat-select placeholder="Select User" [(ngModel)]="userObject.userid" name="userid" required>
    <mat-option *ngFor="let item of userObj" [value]="item.userid">
      {{item.username}}
    </mat-option>
  </mat-select>
</mat-form-field>  

<h2>Selected : {{userObject.username}}</h2>

Answer 1

我只是将整个对象绑定到选择对象，然后使用一个名为selectedUser的变量。显然，您需要userid，但是它和username一样安全地存储在变量中。所以我该怎么做...（还要更改一些变量名以区分它们）：

<mat-select placeholder="Select User" [(ngModel)]="selectedUser" name="userid" required>
  <mat-option *ngFor="let userObj of users" [value]="userObj">
    {{userObj.username}}
  </mat-option>
</mat-select>

{{selectedUser.userid}}, {{selectedUser.username}}

如何在角度显示垫选的选择选项？

1 个答案: