Ionic 2 - 如何禁用按钮组件

时间:2017-06-26 20:58:49

标签: angular typescript ionic2 ionic3 angular-components

我有一个离子组件,它由一个按钮组成,如果属性为true,应该禁用该按钮。但是,我无法弄清楚它是如何工作的。我怎么能让它发挥作用?

component.html

<btn-rounded>
  <button class="ripple" [attr.disabled]="disabled">
    <div>
      {{text | translate}}
    </div>
  </button>
</btn-rounded>

component.ts

  @Input('text') text: string;
  @Input('disabled') disabled: boolean;

  constructor() {}

的index.html

  <btn-rounded text="Login" [disabled]="!this.login.valid"></btn-rounded>

谢谢:)

1 个答案:

答案 0 :(得分:0)

您可以使用 [已禁用]

 <btn-rounded>
      <button class="ripple" [disabled]="disabled">
        <div>
          {{text | translate}}
        </div>
      </button>
    </btn-rounded>

否则你可以尝试这样

[attr.disabled]="disabled== true ? true : null"