FB init函数在angularJs中不起作用

Question

我尝试了很多解决方案对于下面提到的错误但是对我来说没有任何作用我已经为我的实现提供了“https://developers.facebook.com/docs/javascript/howto/angularjs”。

“错误：FB未定义”

我在下面分享我的代码，用于控制器和服务文件。

socialMedia.js -Controller

'use strict';
app
.controller('SocialMediaController', [
  '$rootScope', '$scope', '$location', '$cookieStore' , 'SocialMedia', 'ngToast','$window',
        function ($rootScope, $scope, $location, $cookieStore, SocialMedia, ngToast,$window) {

        $window.fbAsyncInit = function() {
            FB.init({ 
              appId: '************',
              status: true, 
              cookie: true, 
              xfbml: true,
              version: 'v2.4'
            });
        };

        // Load the SDK asynchronously
        (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/sdk.js";
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));

        $scope.testAPI = function() {
            SocialMedia.getMyLastName() 
             .then(function(response) {
               $scope.last_name = response.last_name;
            }
            );
        };

  }
]);

socialMedia.js -Services

   'use strict';
app
.factory('SocialMedia', [
    '$http', '$cookieStore', '$rootScope', 'appApi', function ($http, $cookieStore, $rootScope, appApi) {

        return {
            getMyLastName: function() {
                var deferred = $q.defer();
                FB.api('/me', {
                    fields: 'last_name'
                }, function(response) {
                    if (!response || response.error) {
                        deferred.reject('Error occured');
                    } else {
                        deferred.resolve(response);
                    }
                });
                return deferred.promise;
            }
        }
    }
]);

Html文件

<input type="button" ng-click="testAPI()" value="Save" class="btn btn-primary md-trigger" />

让我知道我错在哪里。

Answer 1

在异步加载SDK后调用FB函数，否则会抛出＆＃34; FB未定义＆＃34;。

将此代码放在AngularJs脚本的一边。

// Load the SDK asynchronously
(function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[   
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/en_US/sdk.js";
      fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

代码没有测试，请测试并更新回来。

Answer 2

尝试删除

'use strict';

当你使用它时，你必须在使用它之前声明FB。 删除它使用严格我认为你可以解决这个问题。

这是我所知道的最佳解决方案。

谢谢 Chathula