时间戳

首页 > 解决方案 > How to validate checkbox list?

typescript - How to validate checkbox list?

问题描述

I am trying to validate check boxes associated with my list data. and i want to check whether all checkbox in the list are selected or not.

<li class="checkbox-wrap" *ngFor="let data of setupData">
    <span *ngFor="let groupdata of data.groupTypes">
         <span *ngFor="let servicedata of groupdata.printServices">
              <md-checkbox [checked]="selectAll" (click)="checkedService()">{{data.serviceCategoryDisplayName}} / {{groupdata.groupTypeDisplayName}} / {{servicedata.printServiceDisplayName}}</md-checkbox>
         </span>
       </span>
     </li>

please suggest a way to check whether all check boxes are selected or not.

标签： typescriptangular5

解决方案

您可以为复选框提供一个带有循环索引的 id：

<span *ngFor="let servicedata of groupdata.printServices; index as i">
          <md-checkbox id="id_{{i}}" [checked]="selectAll" (click)="checkedService()">{{data.serviceCategoryDisplayName}} / {{groupdata.groupTypeDisplayName}} / {{servicedata.printServiceDisplayName}}</md-checkbox>
</span>

为了验证你可以得到这样的值：

for(let item in this.data){
   var input = document.querySelector("#id_"+i);
   console.log(input.checked);
   i++;
}

你可以在这里测试它： https ://stackblitz.com/edit/angular-gf5zss?file=src%2Fapp%2Fapp.component.ts

推荐阅读