我需要在路由器中设置菜单链接数组,然后使用#each在模板中渲染它们.但似乎#linkTo助手无法识别变量.我怎么解决这个问题?
路由器:
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'} ]) } })
应用程序模板中的链接呈现
{{#each link in mainControls}} {{#linkTo link.route class=link.classes}} {{link.name}} {{/linkTo}} {{/each}}
错误信息:
ember.debug.js:51 Error: assertion Failed: The route link.route was not found
灰烬版:
// Version: v1.0.0-pre.4 // Last commit: 855db1a (2013-01-17 23:06:53 -0800)
解决方法
如果你还在努力克服ken的选择,你可能想尝试这样的事情:
{{#each link in mainControls}} <a {{action "goToLink" link}} {{bindAttr class="link.classes"}}> {{link.name}} </a> {{/each}}
然后你需要一个goToLink函数来处理这个动作.你可以把它放在你的Collection上,但是如果你不这样做,它应该冒泡到你的路由处理程序,从理论上讲,它应该让事情变得非常简单:
App.MyRoute = Ember.Route.extend({ // ... stuff ... actions: { goToLink: function(item) { this.transitionTo(item.route); } } });
您可以在此处阅读有关操作的更多信息:http://emberjs.com/guides/templates/actions/
更新
我用最新最好的Ember为你拼凑了一个小提琴.
由于我发现的一些技术限制,我对上面的建议略有不同.
具体来说,Route似乎只能处理由Route内部创建的控制器的操作.这是导航菜单的一个问题,因为您正在更改路线,而它仍在屏幕上.
如果我切换到使用Handlebars“渲染”帮助器来渲染菜单,则没有路由器似乎愿意处理该操作.但是,当前的路由器似乎总是被连接在控制器上的“发送”的气泡链中.所以,我只是让控制器在链路上向路由器发送一个事件,我们得到了路由幸福.
你可以找到小提琴,这里:http://jsfiddle.net/Malkyne/fh3qK/
更新2
这是同一小提琴的另一个版本,只有(奇怪的未记录的)ApplicationRoute用于直接处理动作,而控制器不必进行任何中继:http://jsfiddle.net/Malkyne/ydTWZ/