I've written a code for frontend Facebook login with Django-rest in the backend for verification. But, the button attribute in my HTML file is not getting displayed Here is the code to my file(HTML) in AngularJS
<!DOCTYPE html>
<html>
<head>
<title>Facebook Login JavaScript Example</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<meta charset="UTF-8">
</head>
<body>
<div id="fb-root">
</div>
<script>
//facebook here
//***************************************************
window.fbAsyncInit = function() {
FB.init({
appId : 'Not inserted app id here for security reasons',
status : true,
xfbml : 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/en_US/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</ script>
<button ng-click="login_fb()">Login with facebook</button>
<script>
angular.module("myApp").controller("UserCtrl",
['$scope','$location', 'Facebook',
function($scope, $location, Facebook /*we will write this factory next*/){
$scope.login_fb = function(){
Facebook.login().then(function(response){
//this is where we'll contact backend. for now just log response
console.log(response);
});
}
}]);
</ script>
<script>
angular.module("myApp").factory('Facebook',
["$q", "$window", "$rootScope",
function($q, $window, $rootScope) {
// since we are resolving a thirdparty response,
// we need to do so in $apply
var resolve = function(errval, retval, deferred) {
$rootScope.$apply(function() {
if (errval) {
deferred.reject(errval);
} else {
retval.connected = true;
deferred.resolve(retval);
}
});
}
var _login = function(){
var deferred = $q.defer();
//first check if we already have logged in
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
// the user is logged in and has authenticated your
// app
console.log("fb user already logged in");
deferred.resolve(response);
} else {
// the user is logged in to Facebook,
// but has not authenticated your app
FB.login(function(response){
if(response.authResponse){
console.log("fb user logged in");
resolve(null, response, deferred);
}else{
console.log("fb user could not log in");
resolve(response.error, null, deferred);
}
});
}
});
return deferred.promise;
}
return{
login: _login,
};
}]);
</ script>
</body>
</html>
Can anbody please tell me why my button not getting displayed.
the button attributeeven mean? Please explain things in more precise terms and explain what is expected to happen, when or how it should happen and what is currently happening. this is just not the proper way to ask a uestion