Fahad Billah
Fahad Billah

Reputation: 429

Facebook like button using iframe in a AngularJS website

I was trying to implement facebook like button using iframe in my AngularJS website. But facebook button is not loading.

//html portion
<div ng-controller="FBCtrl">
  <iframe ng-src="{{likeURL}}"></iframe>
</div> 

//controller portion
.controller('FBCtrl',['$scope', function($scope){
  $scope.likeURL = 'http://www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fflyerbd&width&layout=standard&action=like&show_faces=true&share=true&height=80';
}]);

Basically i want a simplified way to use facebook like button in my website.

Thanks in advance.

Upvotes: 1

Views: 938

Answers (1)

musically_ut
musically_ut

Reputation: 34288

You should use the $sce service in your controller and recognize the URL as trustworthy:

.controller('FBCtrl',['$scope', '$sce', function($scope, $sce){
  $scope.likeURL = $sce.trustAsResourceUrl('http://www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fflyerbd&width&layout=standard&action=like&show_faces=true&share=true&height=80');
}

Related: How to set an iframe src attribute from a variable in AngularJS .

Upvotes: 2

Related Questions