如何解决Angular Material Dropdown:具有绑定的对象值,初始默认值未显示
具有一个简单的下拉菜单,其中填充了用户对象:
<mat-form-field>
<mat-label>User</mat-label>
<mat-select [(ngModel)]="userSelected" id="user">
<mat-option *ngFor="let user of users" [value]="user">
{{user.id}} {{user.name}}
</mat-select>
</mat-form-field>
user和userSelected对象是简单的User-object,具有ID和名称字段:
users: User[] = [
{
id: 'k2l13',name: 'SomeName'
},{
id: 'l3213',name: 'AnotherName'
},{
id: '23p13',name: 'OneMore'
},];
userSelected: User = {
id: 'k2l13',name: 'SomeName'
},
显示下拉菜单时,上述解决方案不会显示userSelected为默认用户。但是,对象会在值更改时正确绑定。
如何将对象绑定到下拉菜单并初始显示?
解决方法
这是一种预期的行为,因为userSellected
和users[0]
没有共享相同的引用(只是{} == {}
语句的结果为false)。
考虑应用以下更改,以便userSellected
引用数组中的现有项:
userSelected: User = this.users[0];
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。