Angular service to handle facebook
- Download the package, you can download the zip file, or use bower:
bower install ng-facebook
- Modify your application to include
ngFacebook
in your application dependencies - Configure the ngFacebook module using the configuration steps outlined in the section titled "Configuration" below.
- Load the Facebook SDK for javascript, BUT DO NOT call
FB.init
or setwindow.fbAsyncInit
. These steps are automatically done by the ngFacebook module.
Example:
angular.module('<your-app>', ['ngFacebook'])
.config( function( $facebookProvider ) {
$facebookProvider.setAppId('<your-facebook-app-id>');
})
.run( function( $rootScope ) {
// Cut and paste the "Load the SDK" code from the facebook javascript sdk page.
// Load the facebook SDK asynchronously
(function(){
...
}());
})
;
var DemoCtrl = function ($scope, $facebook) {
...
function refresh() {
$facebook.api("/me").then(
function(response) {
$scope.welcomeMsg = "Welcome " + response.name;
},
function(err) {
$scope.welcomeMsg = "Please log in";
});
}
};
For more details check out this plunker which uses ngFacebook.
You must configure your facebook application ID
in your app, for example:
app.config(function(FacebookProvider) {
$facebookProvider.setAppId(11111111111);
});
You can also configure the next properties.
Use set
and get
. For example $facebookProvider.setAppId(11111)
-
permissions(<string>)
for permissions which required by your app.Example:
$facebookProvider.setPermissions("email,user_likes");
-
customInit(<object>)
custom initial p.Example to set:
$facebookProvider.setCustomInit({ channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html' });
-
$facebook.config(property)
- Return the config property. -
$facebook.getAuthResponse()
- Return theAuthResponse
(assuming you already connected) -
$facebook.getLoginStatus()
- Return promise of the result. -
$facebook.login()
- Logged in to your app by facebook. Return promise of the result. -
$facebook.logout()
- Logged out from facebook. Return promise of the result. -
$facebook.ui(params)
- Do UI action(see facebook sdk docs). Return promise of the result. -
$facebook.api(args...)
- Do API action(see facebook sdk docs). Return promise of the result. -
$facebook.cachedApi(args...)
- Do API action(see above), but the result will cached. Return promise of the result.Example:
app.controller('indexCtrl', function($scope, $facebook) { $scope.user=$facebook.cachedApi('/me'); });
The service will broadcast the facebook sdk events with the prefix fb.
.
In return you will get the next arguments to your $on
handler: event,response,FB
(FB
is the facebook native js sdk).
fb.auth.login
fb.auth.logout
fb.auth.prompt
fb.auth.sessionChange
fb.auth.statusChange
fb.auth.authResponseChange
fb.xfbml.render
fb.edge.create
fb.edge.remove
fb.comment.create
fb.comment.remove
fb.message.send
For additional information about the events see the sdk docs.
This project is released over MIT license