How to uncheck a checkbox in angular2

I have code in the HTML file that looks like this

 <tr *ngFor="#tradeSource of tradeSources">
         <input type="checkbox" ngControl="tradeSource"    [(ngModel)]="tradeSource['checked']"/>

A user can check the check box then click a “Process” button that will run some code, after this code has run I would like to uncheck this checkbox. Ive tried code like

this.tradeSources[i]['checked'] = false

But this isnt working

Leave a Reply

2 Comment threads
0 Thread replies
Most reacted comment
Hottest comment thread
1 Comment authors
Jason Recent comment authors
newest oldest most voted
Notify of

The code you should rather try is: this.tradeSources[i]['checked'] = false Edit I think that your problem is because you have the same name for each control of checkboxes: <input type="checkbox" ngControl="tradeSource" [(ngModel)]="tradeSource.checked"/> If you remove the ngControl attribute, it works: <input type="checkbox" [(ngModel)]="tradeSource.checked"/> See this plunkr: If you really want an ngControl you could define it this way: <tr *ngFor="#tradeSource of tradeSources;#i=index"> <td> <label> <input type="checkbox" [ngControl]="'trade'+i" [(ngModel)]="tradeSource.checked"/> </label> </td> (...) </tr>


I believe the reason this is not working, and which should probably also throw an error in your console, is the usage of unbinded ngControl. It should be enough to just do:

<input type="checkbox" [(ngModel)]="tradeSource['checked']">