Angularjs FaceBook LIke button - facebook

Question

I am having an angular app in which for each image i want to have a Face book like button.
How can i integrate with Facebook API. also when the user clicks on like button of Facebook image i want to increment the like count. Should i use a static counter or can i get the return value from Facebook
It will be helpful if someone provides me few links for face book likes integration to Angular App.
Thanks

Answer 1

There is very nice module for angular-facebook.Take a look
https://github.com/pc035860/angular-easyfb
You could do something like this using it.
<div class="fb-like" onrender="fbLikeRendered()"
data-href="https://developers.facebook.com/docs/plugins/"
data-layout="standard"
data-action="like"
data-show-faces="true"
data-share="true"></div>

Answer 2

I recently created some simple directives for Facebook Like and some other social sharing buttons, you can see a working demo and full details at http://jasonwatmore.com/post/2014/08/01/AngularJS-directives-for-social-sharing-buttons-Facebook-Like-GooglePlus-Twitter-and-Pinterest.aspx
Here is the code for the Facebook Like directive from the post:
angular.module('myApp')
.directive('fbLike', [
'$window', '$rootScope', function ($window, $rootScope) {
return {
restrict: 'A',
link: function (scope, element, attrs) {
if (!$window.FB) {
// Load Facebook SDK
$.getScript('//connect.facebook.net/en_US/sdk.js', function () {
$window.FB.init({
appId: $rootScope.facebookAppId,
xfbml: true,
version: 'v2.0'
});
renderLikeButton();
});
} else {
renderLikeButton();
}
function renderLikeButton() {
element.html('<div class="fb-like" data-layout="button_count" data-action="like" data-show-faces="true" data-share="true"></div>');
$window.FB.XFBML.parse(element.parent()[0]);
}
}
};
}
]);