如何显示多个对象值值 mat-option 或将多个值绑定到 mat-option

Question

在参考使用自动完成如何过滤多个属性上的对象的问题时，我已经根据名称和类型过滤了对象。在 mat-option 的 value 属性中，我想同时显示对象名称和类型属性，如何做到这一点？我试过 [value] ="option.name (option.type)" 我看到错误

Answer 1

您可以将其用作表达式：

[value]="option?.name + ' ('+ option?.type + ')'"

或者

value = "{{ option?.name + ' (' + option?.type + ')' }}"

Answer 2

另一种方法是修改原始对象本身（保持 html 标记干净）就更改或任何其他逻辑而言，这将很有帮助：

constructor() {

  this.objectOptions.forEach(obj => {

    obj.type = obj.name + '(' + obj.type + ')';

  });

}

它可以通过以下方式完成：

<mat-option *ngFor="let option of objectOptions" [value]="option.type">

      {{option.name }}

</mat-option>