如何绑定mat-select的check属性

Question

在此堆栈闪电战中：

https://stackblitz.com/edit/angular-mat-select-multi-with-formcontrol-nfsokg?file=app%2Fselect-overview-example.html,app%2Fselect-overview-example.ts

下拉列表中条目“一”、“二”、“三”、“四”、“五”的复选框的默认设置为 false，因此所有复选框均未选中。

如何将这些值双向数据绑定到 ts 文件中的变量“checks”？：

检查：boolean[] = [true, true, false, false, true];

Answer 1

mat-select multiple，绑定变量时是一个带有所选值的字符串。

您可以以仅“checkes”的方式过滤数组“allNums”

  allNums: string[] = ['one', 'two', 'three', 'four', 'five'];
  checks: boolean[] = [true, true, false, false, true];
  value:string[]= this.getValues(this.allNums,checks)

getValues(allNumns:string[],checks:boolean[])
{
    return allNumns.filter((x,index)=>checks[index]);
}

记住数组的 filter 方法，如 find、map、forEach、reduce 等有一个附加参数，它是“索引”

注意：要返回 true/false 数组，您可以使用 map

const checks=this.allNums.map(x=>value.indexOf(x)>=0)