Javascript 如何选择angular 6中的所有复选框？

如何选择angular 6中的所有复选框

我正在尝试创建一个带有复选框的表，但我无法设置一个复选框来选中每页中的所有复选框。 我想勾选所有复选框，但它无法正常工作

html

身份证件
文件名
{{item.id}
{{item.fname}

准备了一个小演示，演示如何使用

ngModel

指令实现这一点。链接：

---

它使用

数组。每个
检查是否全部选中。如果选中，它将重置所有，否则将全部选中。
nice-我会让按钮单击设置变量的真/假，然后将所有复选框设置为该变量。这允许同一按钮在再次单击时关闭所有复选框。。。例如：如果您创建了一个包含所有复选框的变量，并单击“设置”按钮。所有复选框=！这个。所有复选框。。。。。。。这将在每次单击时切换AllCheckBox变量。。。然后您只需要拥有这个.checkboxes.forEach（val=>{val.checked=allCheckBoxes}）；所有复选框将根据所有复选框的状态进行选中/取消选中variable@gavgrif这只是一个概念，可以根据需要进行更改。@gavgrif我已经更新了解决方案，如果选中了所有，则取消选中所有。all select checkbox的默认行为感谢这个唯一的问题是，它现在在数组上有两个迭代-一个用于检查是否选中了每个复选框，然后第二个用于更改每个复选框的选中状态。用我在评论中的方式做这件事要简单得多。但正如你所说的-只是一个可以修改的概念…导出类AppComponent{allcheckbox:boolean=false；checkbox:any[]=[{name:'cb1'，value:'cb1'，checked:false}，{name:'cb2'，value:'cb2'，checked:true}，{name:'cb3'，checked:false}，{name:'cb4'，checked:false}，{name:'cb5'，value:'cb5'，checked:false}，]CheckAllOptions（）{this.allCheckboxes=！this.allCheckboxes；this.checkboxes.forEach（val=>{val.checked=this.allCheckboxes}）；}
import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'Angular 6 CheckBox Select/ Unselect All';
  masterSelected:boolean;
  checklist:any;
  checkedList:any;

  constructor(){
      this.masterSelected = false;
      this.checklist = [
        {id:1,value:'A',isSelected:false},
        {id:2,value:'B',isSelected:true},
        {id:3,value:'C',isSelected:true},
        {id:4,value:'D',isSelected:false},
        {id:5,value:'E',isSelected:false},
        {id:6,value:'F',isSelected:false},
        {id:7,value:'G',isSelected:false},
        {id:8,value:'H',isSelected:false}
      ];
  }

}