AngularJS:禁用提交和服务器响应之间的所有窗体控件?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (19)

如果我想在用户点击某种“保存”或“提交”按钮的某个时间段内禁用表单控件(或者至少使它们不可用于用户交互),那么我有困惑什么是最好的(和正确的)方法以及通过电线传输的数据。我不想使用JQuery(这是邪恶的!),并查询所有元素作为数组(通过类或属性标记)我到目前为止的想法是:

  • 使用cm-form-control自定义指令标记所有元素,该指令将订阅2个通知:“数据发送”和“数据处理”。然后自定义代码负责推送第二个通知或解决承诺。
  • 使用promiseTracker(不幸的是!)强制产生非常愚蠢的代码ng-show="loadingTracker.active()"
  • 仍然使用JQuery

有没有人有更好的主意?

提问于
用户回答回答于

将所有字段放在fieldset中并使用ngDisabled指令,如下所示:

<fieldset ng-disabled="isSaving"> ... inputs ...</fieldset>

它将自动禁用字段集内的所有输入。

然后在控制器设置$scope.isSavingtruehttp调用之前和false之后。

用户回答回答于

现代浏览器中有一个简单的解决方案:

  1. 定义一个css类 .disabled { pointer-events: none; ... ... }
  2. 添加此类到 ng-form <ng-form data-ng-class="{ 'disabled': isSaving }"> ... inputs ... </ng-form>

指针事件支持图表。

注意:即使你设置了pointer-events: none,你仍然可以用键盘输入元素。

扫码关注云+社区