问题描述
我在自己的选择中集成了一个功能,其中选择了所有选项。选择有效,但未显示所选部分。没有所有选择功能,我的选择效果很好。你知道我的错误在哪里吗?
我在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 (将#修改为@)