core/authentication/password-input.component.ts
The component is used to display a password control that includes the functionality of hiding and showing the input value.
| providers |
{
provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PasswordInputComponent), multi: true
}
|
| selector | c8y-password-input |
| templateUrl | ./password-input.component.html |
Properties |
Methods |
Inputs |
| autocomplete |
Type : string
|
Default value : 'off'
|
|
Value for autocomplete attribute of input |
| id |
Type : string
|
Default value : ''
|
|
Id of input |
| onFocusOut |
onFocusOut()
|
|
Returns :
void
|
| onInput | ||||||
onInput($event: any)
|
||||||
|
Parameters :
Returns :
void
|
| registerOnChange | ||||||
registerOnChange(fn: any)
|
||||||
|
Parameters :
Returns :
void
|
| registerOnTouched | ||||||
registerOnTouched(fn: any)
|
||||||
|
Parameters :
Returns :
void
|
| Optional setDisabledState | ||||||
setDisabledState(isDisabled: boolean)
|
||||||
|
Parameters :
Returns :
void
|
| writeValue | ||||||
writeValue(value: any)
|
||||||
|
Parameters :
Returns :
void
|
| disabled |
Default value : false
|
| onChange |
Default value : () => {...}
|
| onTouched |
Default value : () => {...}
|
| type |
Type : string
|
Default value : 'password'
|
| value |
Type : string
|
Default value : ''
|
<div class="input-group input-group-password">
<input
class="form-control"
[type]="type"
[value]="value"
[id]="id"
(input)="onInput($event)"
(focusout)="onFocusOut()"
[disabled]="disabled"
[autocomplete]="autocomplete"
/>
<span class="input-group-btn">
<button
*ngIf="type === 'password'"
class="btn btn-clean"
title="{{ 'Show password' | translate }}"
type="button"
(click)="type = 'text'"
>
<i class="dlt-c8y-icon-eye"></i>
</button>
<button
*ngIf="type === 'text'"
class="btn btn-clean"
title="{{ 'Hide password' | translate }}"
type="button"
(click)="type = 'password'"
>
<i class="dlt-c8y-icon-eye-slash"></i>
</button>
</span>
</div>