將響應從工廠返回到Angular中的控制器

Question

我有一家工廠 ，通過api調用請求用戶數據：

angular.module('MyApp')
    .factory('UserApi', function($auth,Account){
        return {
            getProfile: function()
                {
                 Account.getProfile()
                    .then(function(response){
                        return response.data; ----> returning json data ok!!
                    });

                }
        }   
});

但是當我在控制器中調用函數時，它返回我未定義的

myApp.controller('AppCtrl', function($rootScope,$state,$window,$document,$scope,$filter,$resource,cfpLoadingBar,$translate,UserApi){

$scope.user = function(){
        UserApi.getProfile().then(function(data){
            $scope.currentUser = data;
        })
    }
console.log($scope.user()); ----> undefined
});

帳戶工廠：

angular.module('MyApp')
    .factory('Account', function($http){
        return {
            getProfile: function(){
                 return $http.get('/api/me');
            }
        }
    });

登錄控制台的錯誤是TypeError: Cannot read property 'then' of undefined

---

編輯

唯一可用的解決方案是將response.data設置為$rootScope.user ，其中數據將在各個控制器之間可用。

angular.module('MyApp')
    .factory('UserApi', function($auth,Account,$rootScope){
        return {
            getProfile: function()
                {
                 Account.getProfile()
                    .then(function(response){
                        $rootScope.user = response.data; ----> returning json data ok!!
                    });
                    return $rootScope.user;
                }
        }   
});

Answer 1

編輯 ：

您將無法定義。 因為：

• $scope.user沒有return
• 您的console.log($scope.user($scope.user())僅在初始時間起作用。
• 從UserApi.getProfile()獲取數據會有時間延遲
• 另外，您的代碼有一些錯誤：

我可以建議：

• 初始時不要使用console.log($scope.user()) 。
• 或者，您應該在工廠創建時獲取所有數據的初始時間。 然后，在控制器中使用UserApi.data 。（但是，這會有時間延遲。如果在加載控制器之前請求返回響應，則可能會獲取成功數據）。

。

angular.module('MyApp')
    .factory('UserApi', function ($auth, Account) {
        var data;
        Account.getProfile().then(function (response) {
            data = response.data;
        });
        return {
            data: data
        }
    });

myApp.controller('AppCtrl', function ($rootScope, $state, $window, $document, $scope, $filter, $resource, cfpLoadingBar, $translate, UserApi) {
    console.log(UserApi.data);
});

Answer 2

您正在嘗試成功完成請求后返回數據。 但是，由於這是一個ajax調用，我們不知道它何時完成（基本上在另一個線程上運行）。 有兩種解決方法。

1-像這樣只需回電即可。

angular.module('MyApp')
    .factory('UserApi', function($auth,Account){
        return {
            getProfile: function(){
                     return Account.getProfile(); // return call and resolve in controller.                   

                }
        }   
});

2-您可以使用promise（$ q）

angular.module('MyApp')
    .factory('UserApi', function($auth,Account, $q){
        return {
            getProfile: function(){
                     var deferred = $q.defer();
                     Account.getProfile()
                       .success(function(data){
                           deferred.resolve(data);
                     });                   
                     return deferred.promise; // just return the promise
                }
        }   
});

並且在您的控制器中只需執行以下操作。

myApp.controller('AppCtrl', function($rootScope,$state,$window,$document,$scope,$filter,$resource,cfpLoadingBar,$translate,UserApi){

    $scope.user = function(){
        UserApi.getProfile().then(function(data){
            $scope.currentUser = data;
            console.log($scope.currentUser);
        });
    }
});

Answer 3

首先， getProfile方法應該返回一個promise（不是未定義的，就像在代碼中那樣）：

angular.module('MyApp')
    .factory('UserApi', function($auth,Account){
        return {
            getProfile: function()
                {
                 return Account.getProfile()
                    .then(function(response) {
                        return response.data;
                    });
                }
        }   
});

然后在控制器中，您應該使用then回調：

myApp.controller('AppCtrl', function ($rootScope, $state, $window, $document, $scope, $filter, $resource, cfpLoadingBar, $translate, UserApi) {

    $scope.user = function () {
        UserApi.getProfile().then(function (data) {
            $scope.currentUser = data;
            console.log($scope.currentUser);
        })
    };
});

還要確保您了解同步代碼和異步代碼之間的區別，以及為什么在這種情況下console.log($scope.user())毫無意義：嘗試登錄時響應（如果尚不可用）。 取而代之的是，您提供在數據到達時要調用的回調。