2012-08-19 15 views
13

Próbuję utworzyć usługę Facebook dla Angular, dzięki czemu łatwiej będzie przetestować kod, który musi korzystać z interfejsu Facebook JS SDK i interfejsu Graph API.Wstrzykiwanie JS SDK Facebooka w kontrolery AngularJS

Oto co mam do tej pory:

app.factory('facebook', function() { 
    return FB; 
}); 

window.fbAsyncInit = function() { 
    FB.init({ 
     appId: 'SOME_APP_ID_HERE', // App ID 
     status: true, // check login status 
     cookie: true, // enable cookies to allow the server to access the session 
     xfbml: true, // parse XFBML 
     oauth: true 
    }); 
}; 

// Load the SDK Asynchronously 
(function (d) { 
    var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0]; 
    if (d.getElementById(id)) { return; } 
    js = d.createElement('script'); js.id = id; js.async = true; 
    js.src = "//connect.facebook.net/en_US/all.js"; 
    ref.parentNode.insertBefore(js, ref); 
})(document); 

Teraz wiem, że rzeczywista część Facebook SDK działa ... ale w moim kontrolera odniesienia jest zawsze zerowa.

w moim kontrolera mam tylko coś takiego:

function FooCtrl($scope, facebook) { 
    facebook.getLoginStatus(function(response) { 
     if (response.status === 'connected') { 
      var uid = response.authResponse.userID; 
      var accessToken = response.authResponse.accessToken; 
      // do something 
     } else if (response.status === 'not_authorized') { 
      // the user is logged in to Facebook, 
      // but has not authenticated your app 
     } else { 
      // the user isn't logged in to Facebook. 
     } 
    }); 
} 

kątowa potem narzekanie, że nie może znaleźć facebookProvider. Jakieś pomysły, jak mogę to osiągnąć?

+0

można utworzyć plunker? plnkcr.co, kliknij nowy -> angularJS –

+0

Czy wypróbowałeś https://groups.google.com/forum/?fromgroups#!topic/angular/YkdZsH8ax4o%5B1-25%5D? – Max

Odpowiedz

6

ująć swoją funkcję fabryki z nawiasami tablicy jak poniżej

app.factory('facebook', [function() { 
    return FB; 
}]); 

docs API nie są wystarczająco jasne. Punktem posiadania nawiasów tablicowych jest to, że możesz określić zależności. Zostanie on wstrzyknięty podczas tworzenia usługi za pomocą AUTO. $ Inject. Ale ponieważ nie ma zależności, to pomiń to zadanie :)

W każdym razie, jeśli trzeba zależności można zażądać ich jak to

app.factory('facebook', ["$log", function($someCrazyLoggerService){ 
    $someCrazyLoggerService.log("I'm Auto Injected crazy Logger"); 
}]); 
+0

To rozwiązało problem, który widziałem. Teraz mam cały inny zestaw zagadnień związanych z asynchroniczną naturą FB api ... lol ... cóż, żeby sobie z tym poradzić. Dzięki. –

+1

@ help for ispiration (dla zakresu) spójrz na https://gist.github.com/whisher/6270204 to tylko prosty fragment – Whisher

1

należy przyjrzeć się tym module Facebooku pisałem.

Najpierw użyj FacebookProvider w wywołaniu konfiguracji aplikacji, coś jako FacebookProvider.init ("yourFacebookAppIdHere"); możesz również skonfigurować inne ustawienia, a następnie na kontrolerach użyj usługi Facebook i zarejestruj się na zdarzenia i metody połączeń asyncrhonously;)

https://github.com/ciul/angularjs-facebook

Powiązane problemy