2

我正在尝试将 AddThis 小部件添加到 ember.js 应用程序。我正在使用直接取自 addthis.com 的基本代码：

<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
<a class="addthis_button_facebook"></a>
<a class="addthis_button_twitter"></a>
<a class="addthis_button_google_plusone_share"></a>
<a class="addthis_button_linkedin"></a>
<a class="addthis_button_pinterest_share"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-51ddaec37ede7c28"></script>
<!-- AddThis Button END -->

...并收到此错误：来自http://ct1.addthis.com/static/r07/core085.js第 2 行的“未捕获的类型错误：无法读取未定义的属性‘调用’” 。

我已经请求支持，但还没有运气。关于造成这种情况的任何想法都会有所帮助！提前致谢！

编辑：我目前在应用程序的模板中有上面的代码。

4

1 回答 1

2

我对addthis小部件进行了更深入的研究，恕我直言，从脚本加载的代码做了一些讨厌的事情，比如创建script标签或iframe等等。并且在handlebars模板内，小部件脚本所做的 DOM 操作将无法与ember.js，除非addthis背后的团队做一些事情来使那里的小部件更易于集成。

所以我看了一些替代的共享小部件，sharethis与addthis基本相同，但有一个很大的不同——我很容易使用ember.js

基本上我所做的是为小部件创建一个视图，并在didInsertElement小部件内部调用初始化：

App.WidgetView = Ember.View.extend({
  templateName: 'widget',
  didInsertElement: function() {
    stLight.options({publisher: "ur-733dae74-7b06-4fef-3f54-f60dce5ce03e", doNotHash: false, doNotCopy: false, hashAddressBar: false});
  }
});

然后在另一个模板中，只需执行以下操作即可轻松使用小部件：

{{view App.WidgetView}}

widget模板如下所示：

<script type="text/x-handlebars" data-template-name="widget">
  <span class='st_sharethis_large' displayText='ShareThis'></span>
  <span class='st_facebook_large' displayText='Facebook'></span>
  <span class='st_twitter_large' displayText='Tweet'></span>
  <span class='st_linkedin_large' displayText='LinkedIn'></span>
  <span class='st_pinterest_large' displayText='Pinterest'></span>
  <span class='st_email_large' displayText='Email'></span> 
</script>

在这里查看一个工作演示。

免责声明：虽然我的回答不能直接解决您的问题，但也许它可以通过使用不同的共享小部件来帮助您采取不同的方法，因为我猜您不会ember.js仅仅因为某些不起眼的编程小部件无法正常工作而放弃。

希望能帮助到你。

于 2013-07-11T00:05:21.170 回答