2013-09-26 18 views
5

Ben bir görünümde fb-gibi entegre bir AngularJs Uygulama geliştiriyorum. Sadece ilk kez çalışır ve tarayıcımı da yenilediğimde, diğer görünüme gittiğimde ve eklentiyi geri aldığımda işe yaramaz.AngularJS + Facebook Direktifi çalışmıyor

Bir yönerge oluşturdum.

angular.module('myApp.directives', []).directive('fbLike',['$timeout', function($timeout) { 
return { 
    restrict: 'A', 
    scope: {}, 
    template: "<div class=\"fb-like-box\" data-href=\"{{page}}\" data-width=\"{{width}}\" data-show-faces=\"{{faces}}\" data-height=\"{{height}}\" data-show-border=\"{{border}}\" data-stream=\"{{stream}}\" data-header=\"{{header}}\"></div>", 
    link: function($scope, $element, $attrs) { 
     var working, _ref, _ref1; 

     $scope.page ="https://www.facebook.com/company_name"; 
     $scope.border = false; 
     $scope.height = (_ref = $attrs.fbHeight) != null ? _ref : '260'; 
     $scope.faces = $attrs.fbFaces != null ? $attrs.fbFaces : 'false'; 
     $scope.stream = $attrs.fbStream != null ? $attrs.fbStream : 'true'; 
     $scope.header = $attrs.fbHeader != null ? $attrs.fbHeader : 'false'; 
     $scope.width = (_ref1 = $attrs.fbWidth) != null ? _ref1 : $element.parent().width()-19; 
     $timeout(function() { return typeof FB !== "undefined" && FB !== null ? FB.XFBML.parse($element.parent()[0]): void 0; }); 
    } 
};}]); 

ben başka seçenek ama hiçbir şanslı arıyordu

<script> 

window.fbAsyncInit = function() { 
FB.init({ 

appId: '', 
    status: true, // check login status 
    cookie: true, // enable cookies to allow the server to access the session 
    xfbml: true, // parse XFBML 
    oauth: true 

    }); 

    }; 

(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/es_LA/all.js#xfbml=1"; 
    fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk')); 

</script> 

<div fb-like></div> 

Bence.

Neyin yanlış olduğunu bilmiyorum.

Çok teşekkür ederim

+0

Plunker Demo bir demo var? Aynı sorunu yaşıyorum – rob

+1

@rob Merhaba, evet, Facebook kullanıcı arayüzünü kullanmayı tercih ettim. Bu yüzden app angular-easyfb.js modülünü dahil ediyorum. Ardından,

arayüzüne btn'nizi koydunuz. – schwertfisch

cevap

4

En çözüm şimdi harika çalışıyor, benim App ezfb modülünü eklemektir.

Bu modülü kesinlikle öneriyorum.

.config(function ($FBProvider) { 
    $FBProvider.setInitParams({ 
    appId: '386469651480295' 
    }); 
}) 

Hiç bu anlamaya mı

Github Link

+1

Exfb'yi kullanmayı denedim. Dinamik yolu yeniden oluşturmak için eklentiyi almak için hala bir yenileme gerektiriyor gibi görünüyor. Plunker sadece işe yaradığını gösteriyor gibi görünüyor (FB düğme eklentisi gibi). – Chaddeus

+0

Özellikle: ezfb.init() Yapılandırma aşamasında FB.init parametrelerinizi yapılandırmak (veya yapamazsınız) istemiyorsanız, çalışma aşamasında ezfb.init kullanabilirsiniz. Ve ezfb.init çağrılana kadar ezfb API çağrısı çalışmaz. angular.module ('myApp') .run (function (ezfb) { ezfb.init ({ Bu plunker demo uygulaması APPID benim FB app id //: '386469651480295' }); }); – charneykaye

1

bir açık kaynak hizmeti ngFacebook

bunu kontrol yoktur
+0

'un size yardımcı olacağını umuyoruz. –

2

Sen gibi basit bir şey yapmak mümkün olmalıdır:

directives.directive('fbLike', function() { 
    return { 
     restrict:'E', 
     template: '<div class="fb-like" data-href="{{page}}" data-colorscheme="light" data-layout="box_count" data-action="like" data-show-faces="true" data-send="false"></div>' 
    } 
}); 

... ve HTML Sadece:

<fb-like /> 

Ayrıca, uygulamayı benzer kodda belirtilen alan, görüntülenmeyecek. Chrome'da, geliştirici araçlarında ağ bağlantısını tıklayabilir ve benzer widget'ın JavaScript’inden yapılan ping sonucunu görebilirsiniz. Bulduğum

<div><span>Given URL is not allowed by the Application configuration.: One or more of the given URLs is not allowed by the App&#039;s settings. It must match the Website URL or Canvas URL, or the domain must be a subdomain of one of the App&#039;s domains.</span><script>if (typeof console !=="undefined" && console.log) console.log("Given URL is not allowed by the Application configuration.: One or more of the given URLs is not allowed by the App's settings. It must match the Website URL or Canvas URL, or the domain must be a subdomain of one of the App's domains.");</script></div> 
+0

gibi bir facebook yok. Ayrıca, şablonunuzda alıntılardan kaçarsınız. Bunun yerine şablon dizesini çevreleyen tek tırnak işareti ile önleyebilirsiniz. –

+0

Teşekkür ederim arkadaşım. – schwertfisch