Angular 2 Show Hide Password Component

In this post we will show you Angular 2 Show Hide Password Component could be a Angular 2 code and example that enables the traveler to toggle the password input field text visibility by clicking the toggle icon/checkbox. Styling with Twitter’s Bootstrap 4/3.

Angular 2 of Show Hide password and Bootstrap 4: Add split input button to password or text input. Toggles input sort between “text” and “password”. Add a show hide button to password input fields. Add split input button to password or text input. Toggles input sort between “text” and “password”.

Read More Demo Download

Angular 2 Show Hide Password Requires

  • Angular 4 >=4.0.0
  • Bootstrap 4 v6

Angular 2 Show Hide Password Optional Icons

we add two Optional Icons

  • fontawesome
  • entypo

Angular 2 Show Hide Password Installation

// Installation via git 
$ npm install https://github.com/osahner/ngx-show-hide-password.git --save

Angularjs 2 Show Hide Password Example

// Angularjs 2 Show Hide Password model
// app.module.ts
import { ShowHidePasswordModule } from 'ngx-show-hide-password';
.....
// set Ng-Module
@NgModule({
  .....
  // imports ShowHide Password Module
  imports: [
    ShowHidePasswordModule,
  ],
  .....
})
<!-- password size and icon -->
<show-hide-password size="lg" icon="entypo">
  <!-- password field -->
  <input type="password" name=... />
<!-- end password  -->  
</show-hide-password>

Angularjs 2 Show Hide Password Attributes

  • icon: entypo,fontawesome, nothing (= checkbox)
  • size: lg, sm, nothing

You also like Angular Gauge chart and Angularjs Image Gallery and Angularjs pie chart and Vuejs WYSIWYG Editor and angular 2 gauge chart