web-dev-qa-db-ja.com

angular 6のすべてのチェックボックスを選択する方法は？

TypeScriptコードを以下に示します。

 selectedAll: any;
 selectedAllSecondname: any;

 this.name = [ {name: 'as', value: 'as', selected: false },
                {name: 'bs', value: 'bs', selected: false },
                {name: 'cs', value: 'cs', selected: false } ];
 this.Secondname = [ {name: 'dd', value: 'dd', selected: false },
                {name: 'ee', value: 'ee', selected: false },
                {name: 'ff', value: 'ff', selected: false } ];
 this.Thirdname = [ {name: 'gg', value: 'gg', selected: false },
                {name: 'hh', value: 'hh', selected: false },
                {name: 'ii', value: 'ii', selected: false } ];

  selectAll(){
    for(var i=0; i < this.name.length; i++) {
       for(var j=0; j < this.Secondname.length; j++) {
          this.name[i].selected = this.selectedAll;
          this.Secondname[j].selected = this.selectedAllSecondname;
       }
     }
  }

 checkIfAllSelected(){

    this.selectedAll = this.names.every(function (item: any) {
       this.checkIfAllSecondnameSelected();
       return item.selected == true;
    })
   }

だから私は私が上に宣言したすべてのリストに対して異なる名前を持つ同じ関数を持っています。

 My html:

  <li><input type="checkbox" [(ngModel)] = "selectedAll" (change) = "selectAll();">Select All </li>
  <li *ngFor = "let a of name">
      <input type="checkbox" [(ngModel)]="a.selected" (change)="checkIfAllSelected()">
     {{ a.name }}
   <li>

 <li><input type="checkbox" [(ngModel)] = "selectedAll" (change) = "selectAllSecondname();">Select All </li>
  <li *ngFor = "let d of Secondname">
      <input type="checkbox" [(ngModel)]="d.selected" (change)="checkIfAllSecondnameSelected()">
     {{ d.name }}
   <li>

ここで私がしようとしているのは、すべて選択をクリックした場合、ページ内の他のすべてのチェックボックスをオンにする必要があることです。しかし、それは名前だけをチェックし、セカンドネームとサードネームはチェックしません。

誰かが私がどこで間違っているのか、そしてそれを修正する方法を教えてもらえますか？

htmlangularangular6angular-formsangular-template
3
Priyanka

次のように、selectAll（）の「this.selectedAllSecondname」を「this.selectedAll」に変更するだけです。

 selectAll(){
    for(var i=0; i < this.name.length; i++) {
      this.name[i].selected = this.selectedAll;
    }
    for(var j=0; j < this.Secondname.length; j++) {
      this.Secondname[j].selected = this.selectedAll;
    }
    for(var j=0; j < this.Thirdname.length; j++) {
      this.Thirdname[j].selected = this.selectedAll;
    }
  }
0
Amany Taweel

以下のselectAllメソッドのコードを試してください：-

  selectAll() {
    for (var i = 0; i < this.name.length; i++) {
      this.name[i].selected = this.selectedAll;
    }
    for (var i = 0; i < this.Secondname.length; i++) {
      this.Secondname[i].selected = this.selectedAll;
    }
    for (var i = 0; i < this.Thirdname.length; i++) {
      this.Thirdname[i].selected = this.selectedAll;
    }
  }

ここで作業ソリューションを確認してください。

0
Ankit Sharma