我正在尝试使用由不同类型组成的mat-select组件来编辑某些成员的firebase数据.
我不确定我的节点结构但是我这样做了:
member:
member1:
name:
types:
typekey1 : Title1
typekey3 : Title3
...
types:
typekey1:
key: typekey1
title: Title1
typekey2:
key: typekey2
title: Title2
typekey3:
key: typekey3
title: Title3
...
所以我不能做以下功能
compareFn(t1: Type, t2: Type): boolean {
return t1 && t2 ? t1.key === t2.key : t1 === t2;
}
使用模板
<mat-form-field>
<mat-select [compareWith]="compareFn" [(ngModel)]="member.types" multiple>
<mat-option
*ngFor="let type of types | async"
[value]="type">
{{type.title}}
</mat-option>
我似乎无法找到在compareFn函数中连接这两种类型的方法,并在组件启动时选择了该选项
最佳答案 对于以下结构的对象:
listOfObjs = [{ name: 'john', id: '1'}, { name: 'jimmy', id: '2'},...]
像这样定义标记:
<mat-form-field>
<mat-select
[compareWith]="compareObjects"
[(ngModel)]="obj">
<mat-option *ngFor="let obj of listOfObjs" [value]="obj">
{{ obj.name }}
</mat-option>
</mat-select>
</mat-form-field>
并定义比较函数如下:
compareObjects(o1: any, o2: any) {
if(o1.name == o2.name && o1.id == o2.id )
return true;
else return false
}