如何在ember helpers(linkTo或partial)中使用字符串变量?

hob*_*lin 7 ember.js

我需要在路由器中设置菜单链接数组,然后使用#each在模板中渲染它们.但似乎#linkTo helper无法识别变量.我怎么解决这个问题?

路由器:

Lite.DashboardRoute = Em.Route.extend({
  setupController: function(controller, model) {
    this.controllerFor('application').set('mainControls', [ {path: 'widgets.new', name: 'Add', classes: 'btn btn-success icon-ok-sign'} ])
  }
})
Run Code Online (Sandbox Code Playgroud)

应用程序模板中的链接呈现

{{#each link in mainControls}}
  {{#linkTo link.route class=link.classes}} {{link.name}} {{/linkTo}}
{{/each}}
Run Code Online (Sandbox Code Playgroud)

错误信息:

ember.debug.js:51 Error: assertion failed: The route link.route was not found
Run Code Online (Sandbox Code Playgroud)

灰烬版:

// Version: v1.0.0-pre.4
// Last commit: 855db1a (2013-01-17 23:06:53 -0800)
Run Code Online (Sandbox Code Playgroud)

小智 7

如果你还在努力克服ken的选择,你可能想尝试这样的事情:

{{#each link in mainControls}}
    <a {{action "goToLink" link}} {{bindAttr class="link.classes"}}>
        {{link.name}}
    </a>
{{/each}}
Run Code Online (Sandbox Code Playgroud)

然后你需要一个goToLink函数来处理这个动作.你可以把它放在你的收藏,但如果你不这样做,它应该是泡到你的路由处理,其中,在理论上,应该让事情变得非常简单:

App.MyRoute = Ember.Route.extend({
    // ... stuff ...

    actions: {
            goToLink: function(item) {
                this.transitionTo(item.route);
            }
    }
});
Run Code Online (Sandbox Code Playgroud)

您可以在此处阅读有关操作的更多信息:http://emberjs.com/guides/templates/actions/

更新

我用最新最好的Ember为你拼凑了一个小提琴.

由于我发现的一些技术限制,我对上面的建议略有不同.

具体来说,Route似乎只能处理由Route内部创建的控制器的操作.这是导航菜单的一个问题,因为您正在更改路线,而它仍在屏幕上.

如果我切换到使用Handlebars"渲染"帮助器来渲染菜单,则没有路由器似乎愿意处理该操作. 但是,当前的路由器似乎总是被连接在控制器上的"发送"的气泡链中.所以,我只是让控制器在链路上向路由器发送一个事件,我们得到了路由幸福.

你可以在这里找到小提琴:http://jsfiddle.net/Malkyne/fh3qK/

更新2

这是同一个小提琴的另一个版本,只有(奇怪的未记录的)ApplicationRoute用于直接处理动作,而控制器不必进行任何中继:http://jsfiddle.net/Malkyne/ydTWZ/