如何在Angular 2中更改元素的属性答案

【问题标题】：How to change the attribute of an element in Angular 2如何在Angular 2中更改元素的属性
【发布时间】：2017-12-28 19:26:00
【问题描述】：

是否可以在 Angular 中使用代码更改 HTML 元素的属性？我有一个按钮，我希望它将输入的类型属性从密码更改为文本。最开始想到的是这样的：

模板：

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

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

组件：

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

【问题讨论】：

标签： angular

【解决方案1】：

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

在ts文件中

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

【讨论】：

【解决方案2】：

在您的 HTML 中，

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

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

在你的 TS 中，

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

【讨论】：