@diama/password-strength-checker v1.0.1

password-strength-checker

An Angular library to check input password field strength and return invalid or valid statement with animated bar color.

this library has been built with no dependencies to provide an easy way to use it.

tested with karma and jasmine

Demo

Versions

Getting started

Step 1: Installing

NPM

npm install --save @diama/password-strength-checker

YARN

yarn add @diama/password-strength-checker

Step 2: Import the PasswordStrengthCheckerModule and angular FormsModule module and also ReactiveFormsModule for using it in reactive forms

import {FormsModule, ReactiveFormsModule} from "@angular/forms";
import {PasswordStrengthCheckerModule} from "password-strength-checker";

@NgModule({
  declarations: [AppComponent],
  imports: [
    PasswordStrengthCheckerModule,
    ReactiveFormsModule,
    FormsModule],
  bootstrap: [AppComponent]
})
export class AppModule {
}

Usage

Define options in your consuming component:

@Component({...})
export class ExampleComponent {
  password = new FormControl('', [Validators.required]);
  myRegex = /^\d+$/;
}

In template use password-strength-checker component with your options

<!--Using ng-option and for loop-->
<form>
  <div>
    <label for="password"> Password</label>
    <input type="password" id="password" [formControl]="password" autocomplete="off">
  </div>
  <password-strength-checker [requiredLength]="8" [password]="password.value" [regexPattern]="myRegex"></password-strength-checker>
</form>

API

Inputs