我可以从 Ember {{action}} 访问 HTML el（按钮）吗？

Question

我需要对触发 Ember 操作的 HTML 元素进行操作。

场景很简单，假设我有多行项目，每行都有一个通过 ajax 提取一些数据的操作。我想在 ajax 请求完成之前禁用该特定元素。

我检查了this 属性，但它指的是组件类。

所以在下面的标记中，我想在我的组件类中捕获元素。

<td><button {{action 'cancel' transaction}} class="btn-danger btn">Cancel</button></td>

Answer 1

在 Ember 中没有禁用操作的默认方法。

您可以通过多种方式做到这一点：

1) 使用 CSS 和绑定控制器属性。

a.is-inactive {
  pointer-events: none;
  cursor: default;
}

然后您必须将 className 绑定到控制器属性（非活动）。

<a {{action 'cancel'}} {{bind-attr class="isInactive:is-inactive"}}

2) 您可以在路由操作中检查您的操作已被禁用。使用任何特定的控制器来保存应用程序状态。

  cancel: function() {
       var controller = this.controller;
       if ( controller.get('pendingAction') ) return;

       controller.set('pendingAction', true);
       this.ajax(...., function() {
         ....
         controller.set('pendingAction', false);
       }, function() {
         ....
         controller.set('pendingAction', false);
       });

    }

3) 建立自己的方式..

我已经在discourse forum讨论过这个案例。