PasswordPassword displays strength indicator for password fields.

Password - 图1

Documentation

Import

  1. import {PasswordModule} from 'primeng/password';
  2.  

Getting Started

Password is applied to an input field with pPassword directive.

  1. <input type="password" pPassword />
  2.  

Model Binding

A model can be bound using standard ngModel directive.

  1. <input type="password" pPassword [(ngModel)]="property"/>
  2.  

Properties

NameTypeDefaultDescription
promptLabelstringPlease enter a passwordText to prompt password entry.
weakLabelstringWeakText for a weak password.
mediumLabelstringMediumText for a medium password.
strongLabelstringStrongText for a strong password.
feedbackbooleantrueWhether to show the strength indicator or not.
showPasswordbooleanfalseWhen true, change the input type to text by displaying the password.

Styling

Following is the list of structural style classes, for theming classes visit theming page.

NameElement
ui-password-panelContainer of password panel
ui-password-meterMeter element of password strength
ui-password-infoText to display strength

Dependencies

None.

Source

View on GitHub

  1. <h3 class="first">Password</h3>
  2. <input pPassword type="password"/>
  3.