Question

我有使用ember.js制作的单页应用程序，我在实现社交分享时遇到了一些问题。

我需要在hbs模板中实现这样的东西：

<a href="http://someaddres.com?u={{model.url}}&title={{model.title}}">Link</a>

然而，当这被渲染到浏览器中时，在href字符串中连接了额外的脚本标记，最终链接起作用并且我被重定向但是标题我得到这样的内容：

<script id='metamorph-190-start' type='text/x-placeholder'></script>
MyTitle
<script id='metamorph-19...

我只需要MyTitle。

更具体地说，我使用以下hbs模板进行Facebook共享，模型初始化为路由器：

<a href="https://www.facebook.com/login.php?next=http%3A%2F%2Fwww.facebook.com%2Fsharer%2Fsharer.php%3Fs%3D100%26p%255Btitle%255D%3D{{model.title}}%26p%255Burl%255D%3D{{model.url}}%26p%255Bsummary%255D%3D{{model.summary}}%26p%255Bimages%255D%255B0%255D%3D%2540Model.EventImage%2527%253EShare&display=popup"
target="_blank">
<img src="http://www.simplesharebuttons.com/images/somacro/facebook_img.png" alt="Facebook" />
</a>

我还尝试过第三方库，比如janrain，ShareThis或AddThis，但是有了它们我遇到了初始化问题，当放入模板时根本没有显示按钮，并且还有从模型中定制消息的问题。

谢谢，伊戈尔

Answer 1

方法1 - 使用未绑定

要摆脱模型值周围的变形标记，请尝试使用unbound选项，该选项完全符合以下条件：

<a href="http://someaddres.com?u={{unbound model.url}}&title={{unbound model.title}}">Link</a>

方法2 - 计算URL

如果您需要绑定模型属性并在模型更改时重新评估，则可能更好的方法可能更好，例如在控制器备份模板时生成URL。

假设您的控制器是ApplicationController并且链接位于通讯员application模板中，然后您可以执行以下操作：

App.ApplicationController = Ember.ObjectController.extend({
  url: function() {
    var url = this.get('model.url');
    var title = this.get('model.title');
    // grab here as many properties you need from your model
    var href = 'http://someaddres.com?u=%@&title=%@'.fmt(url, title);
    return href;
  }.property('model')
});

然后在模板中使用这样的计算url属性：

<a {{bind-attr href=url}} target="_blank">Link</a>

希望它有所帮助。

Answer 2

这实际上效果不好，因为这将打开一个新的浏览器选项卡\窗口，而不是使用建议的js代码形式时获得的所需弹出窗口facebook @ https://developers.facebook.com/docs/plugins/share-button/

不幸的是，你还需要在调用window.open（url，“blah”，“width = 300，height = 500”）的Ember.View（例如）中创建一个'action'。

与ember.js进行社交分享

2 个答案:

方法1 - 使用未绑定

方法2 - 计算URL