Question

我使用名为 $ getUser 的.factory（）创建了一个简单的AngularJS服务，该服务从 users.json 获取数据：

{
    "john": {
        "name": "John",
        "address": "New York"
    },

    "bob": {
        "name": "Bob",
        "address": "Boston"
    }
}

现在我想在 mainController ：

中使用这些数据

angular.module('myApp', [])

.factory('$getUser', ['$http', function($http){
    var users = {};

    $http.get('users.json').then(
        function(response) {
            users.data = response.data;
        }
    );

    return users;
}])

.controller('mainController', ['$getUser', function($getUser){

    // I can access whole $getUser object
    console.log($getUser);

    // but when I want to access $getUser.data it gives me 'undefined'
    console.log($getUser.data);

}]);

当我想要console整个 $ getUser 对象时，它可以正常运行，但我无法访问 $ getUser.data 属性。为什么呢？

Answer 1

将工厂创建为：

app.factory('$getUser', ['$http',  function($http) {

  var factory = {               
    query: function () {                
       return $http.get('users.json').then(function (response) {
          return response.data;                            
               }, function (result) {
                   alert("Error: No data returned");
              });             
            }
       }       
        return factory;
}]);

所以你可以称之为：

$scope.data = $getUser.query()

Simple demo Fiddle

但是我建议返回承诺并在控制器中解决它

加载JSON的常用方法是：

app.factory('Items', ['$http',
    function($http) {

        return {
            getJson: function(url) {
                var ItemsJson = $http.get(url).then(function(response) {
                    return response.data;
                });
                return ItemsJson;
            }
        }
    }
]);

和用法：

 var jsonPromise = Items.getJson('jsonData/someJSON.json');
 jsonPromise.then(function (_response) {
 // ...
 }, function (error) {
     console.error(error);
 });

Answer 2

试试这个：

 angular.module('myApp', [])

    .factory('$getUser', ['$http', function($http) {
      var users = {};
      return {
        getData: function() {
          return $http({
            url: 'users.json',
            method: 'GET'
          })
        }
      }
    }])

    .controller('mainController', ['$getUser', function($getUser) {

      // I can access whole $getUser object
      console.log($getUser);

      // but when I want to access $getUser.data it gives me 'undefined'
      console.log($getUser.data);
      $getUser.getData().then(function(data) {
        console.log(data.data);
      });

    }]);

Here

我无法从.factory AngularJS 1.6访问对象的属性

2 个答案: