无法在具有多个组件的选择中进行默认选择

Question

我有2个表单字段，Vehicle type，即（带有过滤器组件的自动完成功能）和Vehicle model i，e，是（具有多个选择组件的选择）< / strong>，如下图所示：

场景：：在选择Vehicle type（针对前自行车）后，相关的Vehicle Model（即自行车型号）显示如下图所示：

现在，我希望像这样在默认情况下选择某些vehicle Models：

我知道这是此question

的副本

但是这里我的情况有所不同，question使用constructor 将选择组件项默认设置为。但是在我的情况下，我已经拥有了constructor用于另一个导入的component（即Chips自动完成）组件。由于缺乏打字稿知识，我无法做到这一点。我被困在这里。

这是stackblitz链接。

Answer 1

在以下位置添加[（ngModel）] =“ sel”：

 <mat-select placeholder="Vehicle Model"  multiple [(ngModel)]="sel">

并在TS集中设置应选择的选项：

this.offeringControl.valueChanges.subscribe（（d）=> {

    if (d === 'Cars') {
      this.vehicles = this.carsmodel;
      this.sel=['Car1', 'Car2'];
    } else if (d === 'Bikes') {
      this.vehicles = this.bikesmodel;
       this.sel=['Bike1', 'Bike2'];
    } else {
      this.vehicles = this.cyclesmodel;
       this.sel=['Cycle1', 'Cycle1'];
    }
  });