Reputation:
I am using Angular 4 and I have a checkbox on my component on the component's html template file:
<input type="checkbox" (change)="canBeEditable($event)">
On my component's .ts file I have this which set's the value to true.
toggleEditable() {
this.contentEditable = true;
}
My problem is that I only want the value changed IF the checkbox IS checked.
So it would look something like:
toggleEditable() {
if (checkbox is checked) {
this.contentEditable = true;
}
}
How can I do this?
Upvotes: 25
Views: 65731
Reputation: 34673
You need to check event.target.checked
to solve this issue. This is how you can achieve that:
<input type="checkbox" (change)="toggleEditable($event)">
In your component's .ts:
toggleEditable(event) {
if ( event.target.checked ) {
this.contentEditable = true;
}
}
Upvotes: 51