我正在使用以这种格式返回JSON数据的API:
{
paging: {
previous: null,
next: null
},
data: [
{ title: 'First Item' },
{ title: 'Second Item' },
...
]
}
我正在使用Angular的$resource服务来获取此数据 我的代码 - 位于控制器中 - 就像这样:
var Entity = $resource('/api/entities');
var entities = $scope.entities = Entity.get();
然后,在视图中,我可以显示如下数据:
<ul>
<li ng-repeat="entity in entities.data">{{entity.title}}</<li>
</ul>
一切正常,但是:
entities.data
的内容暴露给视图,而不是整个entities
对象。如何拦截GET请求返回的数据进行修改 之前填充$scope.entities
?Entity.query()
代替Entity.get()
会更清晰。但是如果我在上面的代码中使用Entity.query()
,我会收到一个错误“TypeError:Object#没有方法'push'”。这是有道理的,因为API返回一个对象而不是一个数组(因此,对象上没有'push'方法)。同样,如果我可以从响应中提取.data
属性,我会有一个数组。 Dan Boyon关注these indications,我设法自定义默认的$resource
服务并覆盖.get()或.query()方法,但我不知道从哪里去那里。
答案 0 :(得分:24)
我认为您不需要修改get或query默认值。只需使用成功回调即可完成您想要的操作。它应该更强大。
Entity.get(
{}, //params
function (data) { //success
$scope.entities = data.data;
},
function (data) { //failure
//error handling goes here
});
Html也会更清洁:
<ul>
<li ng-repeat="entity in entities">{{entity.title}}</<li>
</ul>
顺便说一句,我通常会为我的资源声明服务,然后在需要时将它们注入我的控制器。
myServices.factory('Entity', ['$resource', function ($resource) {
return $resource('/api/entities', {}, {
});
}]);
答案 1 :(得分:1)
您可以像这样使用Response Transformer(transformResponse):
$resource('/api/entities', {}, {
query: {
method: 'GET',
responseType: 'json',
isArray: true,
transformResponse: function (response) {
return response.data;
}
}
});
此代码修改“查询”方法行为,您可以对“get”执行相同操作...!