Warm tip: This article is reproduced from stackoverflow.com, please click
angular typescript

Why all checkbox of column getting checked when checking single checkbox

发布于 2020-03-28 23:13:56

I am working on table. one column of table has checkboxes. When I am clicking one checkbox all checkbox of that column getting checked.

This is my code

<td>                   
<label class="container"> 
  <input type="checkbox" [(ngModel)]="theCheckbox"  data-md-icheck (change)="toggleVisibility($event)"/>
      Checkbox is <span *ngIf="marked">checked</span><span *ngIf="!marked">unchecked</span>
  </label>
</td>

toggleVisibility function is empty

toggleVisibility(data)
{
}

How can I solve this issue?

Questioner
Arvind Chourasiya
Viewed
16
BartoszTermena 2020-01-31 17:46

Try something like this:

<table >
  <thead>
    <tr>
      <th *ngFor="let head of headElements" scope="col">{{head}} </th>
    </tr>
  </thead>
  <tbody>
    <tr  *ngFor="let el of elements;let index = index;">
      <th scope="row">{{el.id}}</th>
      <td>{{el.first}}</td>
      <td>{{el.last}}</td>
      <td>                   

    <input type="checkbox" [(ngModel)]="el.checked" >
    <span *ngIf="el.checked" >checked</span>
    </td>
    </tr>
  </tbody>
</table>

https://stackblitz.com/edit/angular-mnrmpp?file=src/app/app.component.html

Hope it helps!