Question

这是路线：

import Ember from 'ember';

export default Ember.Route.extend({
    actions: {
        closeModal: function () {
            alert('asdf');
        }
    }
});

组件js代码：

import Ember from 'ember';

export default Ember.Component.extend({
    actions: {
        closeModal: function () {
            this.sendAction('closeModal');
        }
    }
});

我想做的是（如代码所暗示的那样;））从组件到路由发送动作，以便路由可以对其进行操作。但是上面的代码不起作用 - 组件正确处理了操作，但是sendAction内部调用的方法没有做任何事情。

修改

我使用以下方法解决了这个问题：

this._controller.send('closeModal');在组件的操作方法中，但这个解决方案并不能让我满意。 Ember的作者说，控制器将在ember 2.0中删除，因此在我的代码中我不想对它们进行任何引用。建议？

Answer 1

组件具有隔离的上下文。因此它对组件外部的任何事物（路由或控制器）一无所知。为了将组件中的操作发送到您的路线，您应该将路线的操作传递给模板中的组件，如下所示：

// your template
{{your-component closeModal="closeModal"}}

现在，当您在组件中致电this.sendAction('closeModal')时，它会触发您模板中组件的操作，在这种情况下，您的路线会采取closeModal操作。

有关详细信息，请参阅文档（http://emberjs.com/api/classes/Ember.Component.html#method_sendAction）

2016年8月3日更新

对于那些在较新版本的Ember中遇到过闭合操作的人，您也可以通过以下方式在此处使用此类操作：

// your template
{{your-component closeModal=(action "closeModal")}}

此操作助手将指向您的控制器的操作，您可以在组件中调用this.attrs.closeModal()或this.get('closeModal')()来触发操作，而不是调用sendAction。

这些操作的好处是操作可能返回可在组件中使用的值。在模态的情况下，这可以例如用于确定在调用closeAction时是否可以关闭模态，如果它返回false例如你可能决定阻止模态关闭

作为旁注，关闭操作始终指向您的控制器，为了让它指向路由操作，您可以查看此插件： https://github.com/DockYard/ember-route-action-helper

在ember.js中发送从组件到路由的动作

1 个答案: