使用角度反应形式禁用/启用离子输入

问题描述 投票:1回答:2

您好我有一个离子应用程序,我试图禁用离子输入使用反应形式这样的事情。

Disable(){
  this.name.disable();
  this.name.updateValueAndValidity();
}

当我尝试启用输入元素时它不起作用

 Enable(){
   this.name.enable();
   this.name.updateValueAndValidatity();
 }

html代码如下所示:

  <ion-item>
     <ion-input type="text" [formControl]="name"></ion-input>
  </ion-item>
  <button ion-button (click)="Disable()">Disable</button>
  <button ion-button (click)="Enable()">Enable</button>

上面的代码适用于html5输入元素但不适用于离子元素。有人请告诉我有什么我想念的。我在这里做了一个演示示例:https://stackblitz.com/edit/ionic-nl1hi3?file=pages%2Fhome%2Fhome.html

ionic2
2个回答
1
投票

我写了一个指令,订阅表单控件状态更改并使用元素引用禁用元素...我不知道这是否是正确的方法,而不是在我的html中为每个元素编写disabled属性我认为这是好的。因为如果离子团队修复了这个bug,我可以删除指令而不修改html代码。这是我实施指令-https://stackblitz.com/edit/ionic-bxfjzs?file=directives%2Fdisable-control.directive.ts的链接

我需要这个指令用于离子输入,离子 - textarea和离子 - 无线电元素。对于其他元素,离子正确处理启用/禁用属性。如果有任何变化请建议......谢谢


0
投票

你能试试吗?

<ion-item>
     <ion-input type="text" [formControl]="name" [Disabled]="nameDisabled"></ion-input>
  </ion-item>
  <button ion-button (click)="Disable()">Disable</button>
  <button ion-button (click)="Enable()">Enable</button>

Disable(){
  this.nameDisabled =true;
  this.name.updateValueAndValidity();
}
© www.soinside.com 2019 - 2024. All rights reserved.