Question

我已经在应用程序路由上定义了openModal操作。我试图在组件中调用此操作。

如果我使用语法进行动作冒泡：

{{my-component openModal="openModal"}}

然后一切都按预期工作，我可以使用this.sendAction("openModal")触发此操作。

但是，我不确定如何使用新的闭包语法获得相同的结果：

{{my-component openModal=(action "openModal")}}

在这种情况下，Ember抱怨控制器上没有定义openModal动作。我是否必须在使用my-component的每个控制器上定义此操作？有没有办法以某种方式使用target选项告诉Ember这个动作是在路线上定义的？可以在单个组件中混合使用冒泡和闭包语法吗？

我使用的是Ember 2.0 beta 1。

Answer 1

在Ember <2.1> 2.2或2.3或2.4或2.5或2.6 或2.7的某处引入可路由组件之前，无法从路径传递闭包动作。

目前，您只能将关闭操作从控制器传递到子组件。

UPD： Miko Paderes暗示可以使用插件：https://github.com/dockyard/ember-route-action-helper

Answer 2

试试这个：

{{my-component openModal=(action send "openModal")}}

...在控制器上使用send方法。

我不能说我完全理解它，因为send的第二个参数是context，但它仍然在路径中正确地传递了我的行动的其他参数。我目前正在使用版本 2.4.5 。

Answer 3

您可以通过控制器对路由进行代理来发送关闭操作。这适用于任何支持关闭操作的Ember版本。唯一需要注意的是，动作名称必须与控制器和路线不同。

例如，给定此模板：

{{foo-component myAction=(action 'foo')}}

您需要在控制器上执行foo操作，该操作可以代理路线：

proxyFooTo: 'fooBar',
actions: {

  foo(context) {
    this.send('proxyFooTo', context);
  }

}

然后在路线上

actions: {
  fooBar(context) {  ... handle fooBar ... } 
}

Answer 4

也可以通过指定目标属性来避免创建控制器，或者如果有控制器已经避免在其中添加更多逻辑，那么

路线

<强> JS

setupController(controller,model){
  this._super(...arguments);
  controller.set('theRoute', this);
},
actions:{
  openModal(data){
    /*...*/
  }
}

模板中的

<强> HBS

{{my-component openModalAction=(action 'openModal' target=theRoute)}}

Answer 5

尝试使用名为ember-route-action-helper的Ember插件，

您可以随时将route-action替换为action＆＃34;可路由的组件＆＃34;变得可用。

{{todo-list todos=model addTodo=(route-action "addTodo")}}

所以上面的代码与

有类似的效果

在路线内，

setupController(controller,model){
  this._super(...arguments);
  controller.set('theRoute', this);
},
actions:{
  addTodo(data){
    /*...*/
  }
}

在HBS内部，

{{todo-list addTodo=(action 'addTodo' target=theRoute)}}