如何将facebook评论添加到单页应用程序？

Question

我有网站新闻(单页应用程序)这个代码在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>

但如果在SPA中查看不包含html或body标签,我只能在单页应用程序中使用durandal

Answer 1

迟到的答案,但也许它会帮助某人.对我来说,在单个页面应用程序上获取唯一fb注释的关键是FB.XFBML.parse();

每次我想呈现唯一的评论:

1. 更改网址,每个fb评论主题分配给特定的网址所以我可能有www.someurl.com/#123,www.someurl.com/#456,www.someurl.com/#789,每个都有自己的fb评论线程.在AngularJs中,这可以完成$location.hash('123');

2. 创建一个新的fb-comments div,其中'number'等于'123','456'或'789'

   <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);
   }