Question

我正在创建一个资源，将数据传递给我的控制器，以获取需要挂钩的现有api。不幸的是，我无法修改后端。

我的资源工厂目前看起来像这样：

'use strict';

        angular.module('XXX')
        .factory('elements', function (
            $resource
        ) {
            return $resource('http://XXX/api/v1/elements/:id',
                {
                    callback: 'JSON_CALLBACK',
                    id: '@id'
                },
                {
                    query: {
                        method: 'JSONP',
                        params: {
                            id: '@id'
                        }
                    },
                    all: {
                        method: 'JSONP',
                        params: {}
                    }
                }
            );
        });

elements.query（）工作正常，但不幸的是，elements.all（）不起作用。我注意到在我的网络选项卡中返回的内容中，以angular.callbacks._2（[{... DATA ...}]）开头 - 这对我来说似乎不对。

UPDATE .....

好的，所以我已经得到了它：

    angular.module('XXX')
    .factory('element', function (
        $resource
    ) {
        return $resource('http://XXX/api/v1/elements/:id',
            {
                id: '@id',
                        callback : 'JSON_CALLBACK',
            },
            {
                query: {
                    method: 'JSONP',
                    params: {
                        id: '@id'
                    }
                },
                all: {
                    method: 'JSONP',
                    isArray: true,
                    params: {
                        callback : 'JSON_CALLBACK',
                    }
                }
            }
        );
    });

然而，它返回到控制台的json作为一个数组进入..我能够解析它以供使用，但现在只是想知道这是否是最佳实践？

Answer 1

这就是 isArray 的意思。你需要isArray标志，因为angular必须创建一个空对象 - 在这种情况下是一个数组 - 之前发送请求。所以所有绑定都可以，因为你有相同的参考。在结果到达时，它将填充到您的变量，结果对象/数组。

我们正在进行这样的服务调用，也许它会对你有帮助：

.factory('Person', function($resource, AppConfig) {
   var Person = $resource(AppConfig.remoteURL + '/person/:id', {}, {
      query: {method:'GET'},
      queryAll: {method:'GET', isArray: true},
      create: {method:'POST'},
      update: {method: 'PUT'}});

   return Person;
});

并将其称为：

Person.queryAll(function (result) {
   angular.isArray(result); // should be true
}, function (error) 
{
    //doh!
}

Answer 2

您可能希望指定一个自定义transformResponse来转换从数组表单中提取数据。

来自$resource docs的片段：

transformResponse – {function(data, headersGetter)|Array.<function(data, headersGetter)>} - 转换函数或此类函数的数组。 transform函数接受http响应主体和头部并返回其转换的（通常是反序列化的）版本。

所以你的代码将是：

all: {
  method: 'JSONP',
  isArray: true,
  params: {
    callback : 'JSON_CALLBACK',
  },
  transformResponse: function(data, headersGetter) {
     return data.[....].DATA;
  }
}

Answer 3

通常，$ resource用于RESTful API。 JSONP只使用GET。

所以，我会使用$ http.JSONP代替$ resource。

在您的代码中，您可以让服务器端支持CORS吗？

Angular $资源JSON回调不起作用 - 这是最佳做法吗？

3 个答案: