Because life's too short to waste time re-typing passwords. Click on the eye icon to view the typed password using angular/javascript. here we go!
your html/markup looks something like this:
<div class="md-form form-sm password-div">
<input type="{{showPassword ? 'text' : 'password' }}" class="form-control form-control-sm">
<label>Password</label>
<a (click)="togglePassword()" class="eye-b">
<i class="{{showPassword ? 'fas fa-eye-slash' : 'fas fa-eye' }}"></i>
</a>
</div>
your ts/js looks something like this:
showPassword: boolean = false;
public togglePassword() {
this.showPassword = !this.showPassword;
}
your scss/css looks something like this:
.password-div{
position: relative;
.eye-b {
color: #ccc;
position: absolute;
top: 9px;
right: 10px;
}
}
That's all...
Top comments (0)