When I click on a button, I am trying to retrieve the Toggle state immediately.
However, I consistently receive a value of true, even when my toggle is actually set to false.
I believe the issue lies in how I am manipulating the DOM.
Here is an example of the HTML code:
Here is the toggle-button implementation:
<ion-toggle class="toggle-small" toggle-class="toggle-calm" id="toggle" [disabled]="value < 21" (ionChange)="addChild(ioToggle.checked)" #ioToggle></ion-toggle>And here is the corresponding TypeScript code:
let toggle = (<HTMLInputElement> document.getElementById('toggle'));
console.log(toggle) // see the image
if (toggle == true){
console.log('this toggle is true')
}
else if (toggle == false){
console.log('this one is false')
}
This is the output of console.log(toggle):
https://i.sstatic.net/gKb9S.png
It seems like I need to access the aria-checked attribute (if I disable the toggle, aria-checked changes to false).