3

私はウェブサイトニュース（シングルページアプリケーション）を持っています。このコードはaspxページでうまく機能します

     <div id="fb-root">
</div>
  <script language="javascript" type="text/javascript">
   (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/all.js#xfbml=1&appId=1403512256546141";
       fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>


  <div class="fb-comments" style="width: 670px; float: left;"   data-href="http://www.facebook.com/share.php?u=http://www.game11.com/%23/newsdetail/24" data-width="670" data-num-posts="10" dir="rtl" lang="aa">
   </div>

しかし、htmlまたはbodyタグだけを含まないSPAのViewで行う方法は、単一ページアプリケーションでdurandalを使用するだけです

4

3 に答える 3

6

遅い答えですが、誰かを助けるかもしれません。私にとって、単一ページのアプリケーションでレンダリングする独自の fb コメントを取得するための鍵は、FB.XFBML.parse();

一意のコメントをレンダリングするたびに:

  1. URL を変更します。各 fb コメント スレッドは特定の URL に割り当てられますコメントスレッド。AngularJs では、これを行うことができます$location.hash('123');

  2. 「番号」が「123」、「456」、または「789」に等しい新しい fb-comments div を作成します。

    <div class="fb-comments" data-href="http://someurl.com/#{{number}}" data-numposts="5" data-width="100%" data-colorscheme="light"> </div>

  3. fb SDK を実行する関数を呼び出す

    function FBfun(path) {
  setTimeout(function() { // I'm executing this just slightly after step 2 completes
    window.fbAsyncInit = function() {
      FB.init({
        appId : '123456789123',
        xfbml      : true,
        version    : 'v2.2'
      });
    };

    (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_US/sdk.js";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));

    FB.XFBML.parse(); // This is key for all this to work!
  }, 100);
}
于 2015-03-25T20:26:47.197 に答える