我正在尝试设置多选下拉列表的选定值,如下所示
//循环根据条件选择多个复选框并进行设置
document.getElementsByTagName('mat-pseudo-checkbox')[index].classList.add('mat-pseudo-checkbox-checked');
document.getElementsByTagName('mat-pseudo-checkbox')[index].setAttribute("ng-reflect-state","checked");
这仅反映了外观上的变化,因为当我尝试通过 (selectionChange)=filter($event) 检索所有选定的复选框时
<mat-select multiple (selectionChange)="filter($event)" formControlName="dropdown">
<mat-option *ngFor="let info of infos" [value]="info">
{{info}}
</mat-option>
</mat-select>
如果事件似乎没有选取我们之前尝试设置的值,请让我知道事件如何在 mat select 的情况下选取选定的值。
P.S:目标是在角度选项卡之间切换时保留多选框
您可以使用以下命令设置选定的值FormControl.setValue()
功能
示例.component.html
<mat-select [formControl]="toppings" (selectionChange)="filter($event)" multiple [(value)]="selected" >
<mat-option *ngFor="let topping of toppingList" [value]="topping">{{topping}}</mat-option>
</mat-select>
示例.组件.ts
toppings = new FormControl();
toppingList: string[] = ['Extra cheese', 'Mushroom', 'Onion', 'Pepperoni', 'Sausage', 'Tomato'];
ngOnInit(){
this.toppings.setValue(['Mushroom', 'Onion']);
}
filter(data){
console.log(data.value);
}
请检查example https://stackblitz.com/edit/angular-fqeepn
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)