Issue
(Working with Angular) Hello, i have a list of checkbox inputs like this:
<input (click)="onCheck(check1)" type="checkbox" />
The onCheck method is:
onCheck(check:boolean){ check = !check }
and a list of boolean properties like this:
public check1:boolean = false
what I want to achieve is that when cliking in the checkbox input, the value of the property in the argument changes.
I tried:
onCheck(check:any){
check = !check
this.check1 = check
}
But i want the method to be dynamic for my checkbox list,
and in the template i tried
<input (click)="onCheck(this.check1)" type="checkbox" />
With the same results. Can you what i am doing wrong, why the value of the boolean property doesnt change?
Solution
- You can't change the
check
parameter in your onCheck function. The simplest way is to bind thecheck
property to yourcheck1
attribute. - Also don't use
click
event as it doesn't provide the check value, usechange
instead:
Modify the template:
<input (change)="onCheck($event)" [checked]="check1" type="checkbox" />
Modify the callback:
onCheck(check:Event){
const isChecked = (<HTMLInputElement>event.target).checked;
this.check1 = isChecked;
}
Answered By - Benjamin Caure
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.