Question

我有工厂使用$resource拨打HTTP电话。工厂代码：

.factory('me', function($resource, API_URL) {
    var url = API_URL + 'api/me';
    return $resource(url);
})

我在控制器中使用它，并设法在视图中显示从工厂返回的数据：

.controller('AppCtrl', function($scope, me) {
    $scope.data = me.get();
   console.log($scope.data);
})

查看显示此数据的代码非常像这样：

<h3>{{data.displayName}}</h3>

当我查看我的控制台时，我发现我收到了数据，但我也得到了$promise和$resolved我感觉我没有按照预期的方式去做，而我确保当我尝试在不同的控制器中使用相同的工厂时：

.controller('newItemCtrl', function($scope, me) {
var data = me.get();
console.log(data.displayName);
})

我未定义。我再次质疑它在第一次使用时是如何工作的，而不是在第二次使用时。

Answer 1

它返回一个承诺，所以你应该这样使用：

.controller('AppCtrl', function($scope, me) {
    $scope.data = me.get(function(data) {
       $scope.data = data;
       console.log($scope.data);
    })
})

https://docs.angularjs.org/api/ngResource/service/ $资源

Answer 2

$resource.get()不会立即返回数据。相反，它返回一个空引用，一旦从服务器返回数据，就会使用数据更新。

您应该使用成功和错误回调，而不是直接将get()的结果分配给您的范围变量：

angular.module('foo').controller('AppCtrl', function($scope, me) {
   me.get(function (result) {
     $scope.data = result;
     console.log($scope.data);
   }, function (error) {
     // handle error here
   });
});

Angular如何正确使用工厂返回的数据

2 个答案: