ember - 关闭操作会导致错误，除非在组件中提供操作，否则不会呈现页面

Question

我正在尝试了解关闭操作，并且只是在测试一些代码，但我似乎无法让它工作。在我的index.hbs 模板中，我渲染了一个像这样的组件：

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

在我的index.js 控制器中，我定义了动作foo：

  foo: function () {
    console.log('foo executed');
  },

在我的test-component.hbs 组件中，我有一个按钮可以触发如下操作：

<button {{action (action 'test')}}>Test Button</button>.

但是页面崩溃，我在控制台中收到以下错误：Uncaught Error: An action named 'test' was not found

我可以通过在test-component.hbs 中插入test 操作来再次呈现页面，但是我的印象是您使用关闭操作，您不需要在组件中放置任何东西？我在这里做错了什么？

Answer 1

您可以考虑关闭操作的简单方法就是传递函数引用。

在你给定的代码中，当你说

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

你基本上是在说

从当前上下文中获取动作 'foo' 并将其作为属性 test 传递

具体示例的伪代码可能如下所示：

{{test-component test=IndexController.actions.foo}}

这意味着test-component 中的属性test 指向与index 控制器中的动作foo 相同的函数。

因此，您可以直接使用它：

// test is an action passed into test-component
<button {{action test}}>Test Button</button>.

这是一个简单的EmberTwiddle example。

当您在test-component 中说{{action (action 'test')}} 时，它会在其当前上下文中寻找动作test，即组件本身，并且该组件没有动作test，它有一个属性称为test，它恰好指向其外部上下文中的一个动作，index 控制器。