javascript - 操作助手无法在 Handlebars 的 {{#if}} 内工作

Question

我有一个 machine_list_item.html 模板，其中包含这段代码:

{{#if view.machine.isGhost}}
<div class="remove-machine-key-association">
    <button {{action "aloha" target="view"}}></button>
</div>
{{/if}}

我在 machine_list_item.js View 中有这个函数:

aloha: function() {
    alert('Tadah!');   
}

该按钮不会调用该函数，并会给出以下错误:

Error: assertion failed: The action 'aloha' did not exist on Mist.MachineListItemView

但是，如果我注释掉 Handlebars 的 {{#if}} 结构，代码就可以正常工作。

任何帮助将不胜感激!

Answer 1

使用 {{#linkTo}} ... {{/linkTo}} 隐式创建 View 。许多 Handlebars block 都这样做。因此 ... 中引用 view 的任何内容实际上都引用了 LinkToView。

要解决此问题，请使用 {{#with ... as ...}} 重命名您的 View ，这样它就不会被遮挡。

{{#with view as myView}}
  {{#linkTo 'machine' myView.machine}}
    {{#if myView.machine.isGhost}}
      <div class="remove-machine-key-association">
        <button {{action "aloha" target=myView}}></button>
      </div>
    {{/if}}
  {{/linkTo}}
{{/with}}

参见this question了解更多详情。