Password

Overview

Use the eye button to reveal the password. It is hidden again when focus leaves the field.

<av-password inputId="password" label="Password"
  [(ngModel)]="password" [feedback]="false" />

Strength feedback

Focus the field to see feedback. Press Escape to dismiss it. The score is a local complexity hint, not a validation rule or a breached-password check.

Sizes and floating labels

The same sizes as Input, with an optional floating label.

Reactive forms

Supports formControl, formControlName and ngModel. Validation belongs to your form.

<av-password inputId="password" label="Password"
  [formControl]="password" />

Disabled

Usage

Import AvPassword and the Angular forms module you use. Give every input a unique inputId.

import { AvPassword } from 'avero-ui';
import { FormsModule } from '@angular/forms';

@Component({
  imports: [AvPassword, FormsModule],
})