SHOW HIDE PASSWORD IN IONIC3
login.html
<ion-item>
<ion-label floating>Password</ion-label>
<ion-input type="{{type}}" name="password" ngModel #password="ngModel" required pattern=".{4,10}"></ion-input>
<button *ngIf="!showPass" ion-button clear color="dark" type="button" item-right (click)="showPassword()"> <ion-icon name="ios-eye-off-outline"></ion-icon></button>
<button *ngIf="showPass" ion-button clear color="dark" type="button" item-right (click)="showPassword()"> <ion-icon name="ios-eye-outline"></ion-icon></button>
</ion-item>
export class AuthenticPage {
public type = 'password';
public showPass = false;
showPassword() {
this.showPass = !this.showPass;
if(this.showPass){
this.type = 'text';
} else {
this.type = 'password';
}
}
}
Comments
Post a Comment