Question

我刚刚将我的Facebook分享按钮添加到我的Angular网站，但只有在刷新页面后才会显示。

所以我在我的index.html中加载了Facebook SDK JS（取自他们的网页）。

<div id="fb-root"></div>
      <script>(function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.5";
        fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'facebook-jssdk'));</script>

然后我有一个ng-view（另一个.html页面，其中我实际上有Share按钮）：

<div class="fb-share-button"
          data-href="http://www.exampleurl.com"
          data-layout="button">
</div>

任何想法为什么按钮仅在页面刷新后出现。可以在我的索引中使用Facebook sdk JS并使用带有ng-view的共享按钮吗？

感谢。

Answer 1

我遇到了同样的问题并通过从我的控制器调用FB.XFBML.parse（）来实现它 - 就像这样：

(function () {
    "use strict";
    angular.module("app")
      .controller("myController", myController);

    function myController() {
        FB.XFBML.parse();
    }
})();

Answer 2

在init之后添加此解决了这个问题。

if (typeof (FB) != 'undefined'&& FB != null) { FB.XFBML.parse(); }

Answer 3

我更简单地解决了这个问题。我的 index.html

评论.html

  <div
class="fb-comments"
[attr.data-href]="url"
data-width="100%"
data-numposts="5"

<块引用>

在review.ts文件中

declare var FB: any;
ngOnInit(): void {
FB.XFBML.parse();

}

Angular - Facebook分享按钮仅在刷新后出现

3 个答案: