Angular 2の要素の属性を変更する方法

Question

HTML要素の属性をAngularのコードで変更することはできますか？入力のタイプ属性をパスワードからテキストに変更するボタンがあります。これは、最初に頭に浮かんだものです：

テンプレート：

<input name="password" type="password" /> 

<button click="showPassword()">eye</button> 

コンポーネント：あなたのHTMLで

showPassword() : void 
{ 
     //how do I change the password input to text input. Is there a better way to do this? 
    } 

Answer 1

<input name="password" [type]="password" /> 

TSファイルで

public password='password'; 
showPassword() : void 
{ 
     this.password=(this.password=='password')?'text':'password'; 
} 

Answer 2

、

あなたのTSで

<input name="password" [type]='password' /> 

<button click="showPassword()">eye</button> 

、

export class ClassName { 
    password: String = 'password'; 
    showPassword() : void{ 
     this.password = (this.password=='password')?'text':'password'; 
    } 
}