title: Changing input type="tel" to password field using Angular 2/Ionic 2
body: <p>I want to change the input type <code>tel</code> to <code>password</code> field using Angular 2/Ionic 2.</p>
  
  <p>I have a pin number field which will take number as input and I want to change the number to password field once the keypress event trigger.</p>
  
  <p>I tried in the following way but the <strong>keypad</strong> is closing after enter the first number.</p>
  
  <pre><code>import { Component, Directive, HostListener } from '@angular/core';
  
    @Directive({
        selector: '.inputmask'
      })    
      export class MyDirective {
         @HostListener('document:keyup', ['$event.target'])
          onFocus(target) {
            target.type = 'password';
          }
          /*@HostListener('focusout', ['$event.target'])
          onFocusout(target) {
            target.type = 'tel';
          }*/
      }
  </code></pre>
  
  <p>And my template:</p>
  
  <pre><code>&lt;ion-input type="tel" [formControl]="aadhaarno" class="inputmask"&gt;
  </code></pre>