2016-11-24 3 views
1

特定のルートに行くと、$ http要求を実行してその結果をサービス内の変数に格納したいと思います。サービス内でプロパティ値を設定するためにresolveからメソッドを呼び出す(AngularJS)

私が '/ users'ルートに行くとき、私は解決でUsersFactory.getUsers()メソッドを実行します。私はこのメソッドが$ http要求を実行し、いくつかのユーザーを返し、それらのユーザーをUsersFactoryのプロパティ "this.usersObj"に入れたいと思います。

私はより一般的のようなものをやってとは対照的に、これを実行したいと思います:

getUsers: function(UsersFactory) { return UsersFactory.getUsers();) 

とコントローラ内のデータ

myApp.controller('UserController', function($scope, getUsers) { 
    $scope.users = getUsers; 
} 

は、だからここに私が試したものだということを得る:

ルートファイル ...

.when('/users', { 
    templateUrl: 'templates/page.html', 
    controller : 'MyCtrl', 
    resolve: { 
     getUsers: ['UsersFactory', function(UsersFactory) { 
      return UsersFactory.getUsers(); 

      // or just: UsersFactory.getUsers(); 
     }] 
     } 

... 

工場

myApp.factory('UsersFactory', 
['$http', '$q', function($http, $q) { 

var self = this; 

var getUsers = function() { 
    function getUsersPromise() { 
     var deferred = $q.defer(); 

     $http({ 
      method: 'GET', 
      url: getFlashcardDecksURL 
     }) 
     .then(function successCallback(response) { 
      var users = response.data; 
      deferred.resolve(users); 
     }, function errorCallback() { 
      deferred.reject('error msg'); 
     }); 

     return deferred.promise; 
    } 

    getUsersPromise() 
    .then(function successCallback(users) { 
     self.usersObj = users; 
    }) 
    .catch(function errorCallback(errorMsg) { 
     self.errorMsg = errorMsg; 
    });  

}; 

var usersObj = []; 

return { 
    getUsers: getUsers, 
    usersObj: usersObj, 
} 

... 

私の試みは動作しません。私のコントローラでUsersFactory.usersObjにアクセスしようとすると、空の配列が返されます。

答えて

1

問題は、データを取得しているが、解決への約束を返すことはなく、成功メソッドからユーザーを返すこともないようです。変更してみてください:

getUsersPromise() 
.then(function successCallback(users) { 
    self.usersObj = users; 
}) 
.catch(function errorCallback(errorMsg) { 
    self.errorMsg = errorMsg; 
}); 

に:

function getUsers() { 
    var deferred = $q.defer(); 

    $http({ 
    // Omitted 
    }) 
    .then(function(res) { 
    usersObj = res.data;   // Put in factory's property 
    deferred.resolve(res.data); 
    }, function(err) { 
    deferred.reject(err) 
    }); 

    return deferred.promise; 
} 

基本的には、resolveが解決されるためにあなたの約束を待ちます:

return getUsersPromise() 
.then(function successCallback(users) { 
    self.usersObj = users; 
    return self.usersObj; 
}) 
.catch(function errorCallback(errorMsg) { 
    self.errorMsg = errorMsg; 
}); 
0

これを試してみてください。だから、約束を返すとresolveは残りを行います。

関連する問題