Select 所有垫子选项无法正常工作

Question

关注我有：

<mat-select [formControl]="tipoAttivitaSelect" multiple >
              <mat-option #selectAll [value]="0" (click)="all()">
                  All
                 </mat-option>
            <mat-option *ngFor="let attivita of mappaAttivita" [value]="attivita" (click)="opzioneSelezionata(attivita.value)">
              {{attivita.description}}
            </mat-option>
          </mat-select>

并且在 .ts 中

@ViewChild('selectAll') private selectAll: MatOption;
tipoAttivitaSelect: FormControl = new FormControl();
mappaAttivita =  [{
      value:"option1",
      description:"Option 1"
  },
  {
      value:"option2",
      description:"Option 2"
  }]

   ngOnInit(){
    this.selectAll.select();
    this.tipoAttivitaSelect.patchValue([...this.mappaAttivita.map(item => item), 0])
  }



all() {
    if (this.selectAll.selected) {
      this.tipoAttivitaSelect.patchValue([...this.mappaAttivita.map(item => item), 0])
    } else {
      this.tipoAttivitaSelect.patchValue([])
    }
  }

我期望的是，当我转到该页面时，它们都被选中了，但它并没有发生。当我进入页面时，只有 "all" 选项被选中，而其他的都没有；然后，如果我取消选中所有选项然后再将其选中，则所有选项都已正确选择。
我不明白为什么会这样，因为我在 ngOnInit 和 "all()"

方法中都执行了相同的操作

Answer 1

您必须在 ngAfterViewInit 中执行 select 全部操作，因为您在 mat-select 加载值之前触发了 all() 函数。那是因为在 angular 生命周期中，mat select 的值仅在视图初始化后加载。

Select 所有垫子选项无法正常工作

Select all mat option does not work properly

angular-material

angular7