Ion-icon touchstart/touchend is treating it almost like a click.
<ion-icon (touchstart)='hideShowPassword(true)' (touchend)="hideShowPassword(false)" slot="end" [name]="passwordIcon" [class.ios-margin]="this.globalData.isIOS" style="zoom: 1.5"></ion-icon>
The first touch/click/press on the ion-icon will trigger the touchstart but not the touchend, however the 2nd one will trigger both the touchstart and touchend as expected.
The same touchstart/touchend functions work as expected on a span object.
hideShowPassword(isPressed) {
console.log(isPressed);
if(isPressed){
this.passwordIcon = ‘eye-off’;
this.passwordType = ‘text’;
}else{
this.passwordIcon = ‘eye’;
this.passwordType = ‘password’;
}
}
Console log output after 2 clicks on the ion-icon:
true
true
false