在垫选择中选择选项时,没有输出 组件模板

问题描述

我在自己的选择中集成了一个功能,其中选择了所有选项。选择有效,但未显示所选部分。没有所有选择功能,我的选择效果很好。你知道我的错误在哪里吗?

我在Stackblitz上的工作

我的代码:

选择

<mat-select [(value)]="selectedValues" formControlName="dashboardValue" multiple>
   <mat-option class="dashboard-select-option" *ngFor="let dashboardPosition of displayDashboardValues" 
      [value]="dashboardPosition.key" (click)="togglePerOne(allSelected.viewValue)">
      {{ dashboardPosition.viewValue }}
   </mat-option>
   <mat-option #allSelected (click)="toggleAllSelection()" [value]="0">Alle</mat-option>
</mat-select>

输出

<div class="col-md-12" *ngIf="selectedValue['valuePositionType'] === 'profit-loss-area'">
   <app-profit-loss-area></app-profit-loss-area>
</div>
<div class="col-md-12" *ngIf="selectedValue['valuePositionType'] === 'cash-area'">
   <app-cash-area></app-cash-area>
 </div>

TS

 public displayDashboardValues = [
    {key:'1',valuePositionType: 'profit-loss-area',viewValue:'Ergebnis'},{key:'2',valuePositionType: 'cash-area',viewValue:'Cash'},]; 

// Dashboard form
    this.dashboardForm = this.formBuilder.group({
      dashboardValue: [null]
    });

// Select options
  togglePerOne(all){
    if (this.allSelected.selected) {
      this.allSelected.deselect();
      return false;
    }
    if(this.dashboardForm.controls.dashboardValue.value.length==this.displayDashboardValues.length)
      this.allSelected.select();
  }

  toggleAllSelection() {
    if (this.allSelected.selected) {
      this.dashboardForm.controls.dashboardValue
        .patchValue([...this.displayDashboardValues.map(item => item.key),0]);
    } else {
      this.dashboardForm.controls.dashboardValue.patchValue([]);
    }
  }

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)