Question

你好，我有一个离子应用程序，我试图使用反应形式禁用离子输入这样的东西。

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

Answer 1

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

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

Answer 2

你能试试吗？

<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();
}

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

2 个答案: