Ember，将动作从模板传递到组件时没有动作处理程序

Question

我正在尝试将动作从路由传递到模板，然后传递给组件。

app/routes/application.js

  actions: {
    showModal(context) {
      console.log("This needs to be triggered" + context)
    },
  }

app/templates/application.hbs

{{some-component 
  showModal=showModal
}}

app/components/some-component/template.hbs

<button {{action "showModal" "The context for the action"}}>Press Me</button> 

运行时。我收到一个错误提示

“没有针对：showModal 的操作处理程序”

虽然，当我在 templates/application.hbs 中包含操作而不将其传递给组件时，一切正常。只是在将动作传递给组件时。

app/templates/application.hbs

<button {{action "showModal" "The context for the action"}}>Press Me</button>

这行得通。我想在一个组件中调用这个动作。如何将此操作传递给组件？

Answer 1

在这种情况下，触发路由动作与触发来自控制器的动作有点不同。当您从控制器或其他组件将操作传递给组件时，您将其包装在操作助手中，如下所示：

{{some-component showModal=(action "showModal")}}

由于您尝试传递的动作存在于路由中，因此您需要使用控制器中的send 方法来调用路由中的动作。您将它传递给组件，如下所示：

{{some-component showModal=(action send "showModal")}}

这是一个twiddle，它有助于将所有内容拼凑在一起。