我需要在 Ember.js 中结合 linkTo 和操作助手。我的代码是：
{{#link-to 'index'}}<span {{action 'clear'}}>Clear</span>{{/link-to}}
但我想让它变成这样：
{{#link-to 'index' {{action 'clear'}} }}Clear{{/link-to}}
并且：
<li>
{{#link-to 'support'}}
<span {{action 'myAction' 'support'}}>Support</span>
{{/link-to}}
</li>
至：
<li>
{{#link-to 'support' {{action 'myAction' 'support'}} }}Support{{/link-to}}
</li>
我怎样才能做到这一点？
这对于 SEO 解决方案来说是可以的！
ember install ember-link-action
您可以将关闭操作作为invokeAction参数传递给{{link-to}}组件：
{{#link-to 'other-route' invokeAction=(action 'testAction')}}
Link to another route
{{/link-to}}
要将参数传递给操作，您可以使用：
{{#link-to 'other-route' invokeAction=(action 'testAction' param1 param2)}}
Link to another route
{{/link-to}}
自动化测试套件确认插件适用于 1.13 到最新的 Ember 3 版本。
它适用于 Ember 的发行版、测试版和金丝雀版。
插件 GitHub 存储库。欢迎投稿。
更新：查看下方 Michael Lang 对 Ember 1.8.1+ 的评论
Myslik 的答案（根本不使用link-to，而是使用actionand then transitionToRoute）的问题在于它对SEO 没用，搜索引擎机器人什么也看不到。
如果您希望将链接指向的内容编入索引，则最容易在<a href=x>其中找到一个好人。最好使用link-to这样您的链接 URL 与您的路由 URL 保持同步。我使用的解决方案既提供了完成工作的操作，又方便link-to地索引页面。
我覆盖了一些功能Ember.LinkView：
Ember.LinkView.reopen({
action: null,
_invoke: function(event){
var action = this.get('action');
if(action) {
// There was an action specified (in handlebars) so take custom action
event.preventDefault(); // prevent the browser from following the link as normal
if (this.bubbles === false) { event.stopPropagation(); }
// trigger the action on the controller
this.get('controller').send(action, this.get('actionParam'));
return false;
}
// no action to take, handle the link-to normally
return this._super(event);
}
});
然后我可以在 Handlebars 中指定要执行的操作以及传递操作的内容：
<span {{action 'view' this}}>
{{#link-to 'post' action='view' actionParam=this}}
Post Title: {{title}}
{{/link-to}}
</span>
在控制器中：
App.PostsIndexController = Ember.ArrayController.extend({
actions: {
view: function(post){
this.transitionToRoute('post', post);
}
}
}
这样，当我缓存页面的渲染副本并将其提供给索引机器人时，机器人将看到一个带有 URL 的真实链接并跟随它。
（另请注意，transitionTo现在不赞成使用transitionToRoute）
这些组合都不适用于 Ember.js，但您不需要组合这两个助手。为什么不直接使用动作助手并让它冒泡到控制器或路由？您可以transitionToRoute在控制器或transitionTo路由中使用。
例如在控制器中你可以有这样的代码：
App.PostsController = Ember.ArrayController.extend({
clear: function () {
// implement your action here
this.transitionToRoute('index');
}
});
这在 1.6.0-beta.5 中运行良好：
<span {{action "someAction"}}>
{{#link-to "some.route"}}
Click Me
{{/link-to}}
</span>
链接将发生，然后单击将冒泡到操作处理程序。它在此处记录（尽管是间接的）。
编辑：更正了打开链接标签中的语法
我喜欢 Cereal Killer 的简单方法，但不幸的是它给我带来了问题。当浏览器导航到另一个路由时，它会重新启动 Ember 应用程序。
从 Ember 2.6 开始，以下简单方法可以解决问题：
<span {{action 'closeNavigationMenu'}}>
{{#link-to 'home' preventDefault=false}}
Go Home
{{/link-to}}
</span>
这实现了以下目标：
这就是我在 O'Reilly Ember.js 书的演示应用程序中解决这个问题的方法：https ://github.com/emberjsbook 。
你可以在这里看到完整的源代码：https ://github.com/emberjsbook/rocknrollcall
在视图中：
{{#if artistsIsChecked}}
{{#if artists.length}}
<h3>Artists</h3>
<ul class="search-results artists">
{{#each artists}}
<li><a {{action 'viewedArtist' this.enid }}>{{name}}</a></li>
{{/each}}
</ul>
{{/if}}
{{/if}}
和控制器：
App.SearchResultsController = Em.ObjectController.extend({
actions: {
viewedArtist: function(enid) {
this.transitionToRoute('artist', enid);
},
viewedSong: function(sid) {
this.transitionToRoute('song', sid);
}
},
needs: ['artists', 'songs'],
artistsIsChecked: true,
songsIsChecked: true,
artists: [],
songs: []
});
遇到同样的问题，我找到了这个简单的解决方案：
{{#linkTo eng.rent class="external-button"}}<div class="internal-button" {{action "updateLangPath"}} >X</div>{{/linkTo}}
然后，管理样式表中的css类external-button和internal-button，我确保“internal-button”覆盖了整个“external-button”区域；这样，如果不点击内部按钮，就不可能点击外部按钮。
这对我来说很有效; 希望它可以帮助...
这就是 Ember 3.11.0 之后带有on修饰符的样子。
<LinkTo
{{on "click" this.recordMetrics}}
@route="post.see-all"
@model={{@model}}
@bubbles={{false}}>
Link Me
</LinkTo>
bubbles显示只是为了说明LinkTo API。
setupControllerEmber 的链接到标签使用路由来打开新视图，因此您可以在目标路由的方法中而不是在控制器操作中执行您想要放入链接的“动作”属性中的任何功能。
请参阅 Ember 指南中的此处：http: //emberjs.com/guides/routing/setting-up-a-controller/
但是，这仅适用于您希望在每次访问路由时都执行该操作，而不是使用特定链接。
确保包含该controller.set('model', model);行以及您放入其中的任何其他内容。