本文介绍了如何在角度材料中获取复选框数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
限时送ChatGPT账号..我想在用户选择时获取所有复选框项目,现在正在获取数据但问题是复选框不会改变,我的意思是当我单击复选框时,如果选中了初始状态,则始终保持检查,反之亦然.
this.settings_data = ["一", "二", "三", "四", "五"];<div class="settings_head" fxFlex="50" *ngFor="let item of settings_data"><mat-checkbox formControlName="settingsCheckboxvalues" (ngModelChange)="seleteditems($event,item)">{{item}}</mat-checkbox>选择项(事件,值){this.allitems.push(value);}
解决方案 我认为你把事情复杂化了.
修改你的数组,使每个条目都有一个 name
和一个 checked
属性,并用 [(ngModel)]
ts
array = [{name: '一个',检查:错误},{name: '二',检查:错误},{name: '三',检查:错误},{name: '四',检查:错误},{name: '五',检查:错误}]获取复选框(){console.log(this.array.filter(x => x.checked === true).map(x => x.name));}
<小时>
html
<mat-checkbox [(ngModel)]="item.checked" (change)="getCheckboxes()">{{item.name}}</mat-checkbox>
<小时>
演示
I want to get the all checkboxes items when user selects, now am getting the data But the problem is that the checkbox don't change, I mean that when I click the checkbox, if the initial state is checked, always remain checked and vice versa.
this.settings_data = ["one", "two", "three", "four", "five"];
<div class="settings_head" fxFlex="50" *ngFor="let item of settings_data">
<mat-checkbox formControlName="settingsCheckboxvalues" (ngModelChange)="seleteditems($event,item)">{{item}}</mat-checkbox>
</div>
seleteditems(event, value) {
this.allitems.push(value);
}
解决方案
I think you are overcomplicating things.
Modify your array so that each entry has a name
and a checked
property, and bind the checkboxes to them with [(ngModel)]
ts
array = [
{
name: 'one',
checked: false
},
{
name: 'two',
checked: false
},
{
name: 'three',
checked: false
},
{
name: 'four',
checked: false
},
{
name: 'five',
checked: false
}
]
getCheckboxes() {
console.log(this.array.filter(x => x.checked === true).map(x => x.name));
}
html
<div *ngFor="let item of array">
<mat-checkbox [(ngModel)]="item.checked" (change)="getCheckboxes()">{{item.name}}</mat-checkbox>
</div>
Demo
这篇关于如何在角度材料中获取复选框数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
更多推荐
[db:关键词]
发布评论