被角度资源解析为二维的一维字符串数组 [英] One dimensional array of strings being parsed to 2d by angular resource

问题描述

来自服务器的以下 JSON 响应

<预><代码>[你好"，世界"]

正在被这个 ngResource 服务解析成一个二维数组

myService.factory('Name', function($resource){返回 $resource(site_url+'api/accounts/:accountId/names/', {}, {列表:{方法:'GET'，参数:{}，isArray:true}});});

这样称呼

$scope.names = Name.list({accountId:$scope.account.id}, function(e){控制台日志(e)；});

追踪到

[{"0":"h","1":"e","2":"l","3":"l","4":"o"},{"0":"w","1":"o","2":"r","3":"l","4":"d"}]

有什么提示吗?

解决方案

TLDR;ngResource 在您的响应中需要一个对象或一组对象.

<小时>

当操作列表中的 isArray 设置为 true 时，ngResource 模块会遍历响应中收到的每个项目并创建资源的新实例.为此，Angular 在接收到的项目和 Resource 类之间执行深度复制，这为我们提供了一个具有特殊方法的对象($save、$delete等)

检查此处的来源.

内部 angular 使用 angular.copy 来执行深拷贝，这个函数只对对象和数组进行操作，当我们传递一个字符串时，它会把它当作一个对象.

JS 中的字符串可以通过提供对每个字符的顺序访问来充当数组.angular.copy 传递字符串时将产生以下内容

angular.copy('hi',{}) =>{0:'h', 1:'i'}

每个字符成为对象中的一个值，其索引设置为键.ngResource 将提供具有 0 和 1 属性的资源.

<小时>

您的选择是:

使用较低级别的$http服务

$http.get('/res').success(function(data){$scope.test = 数据；});

在 json 响应中返回一组对象

[{'data': "hello"}, {'data': "world"}]

拦截响应并更改您的数据

如果您无法修改服务器发回的数据并想要使用 ngResource，您将需要转换响应.在此处

阅读如何操作

The following JSON response from the server

[
    "hello",
    "world"
]

is being parsed into a 2d array by this ngResource service

myService.factory('Name', function($resource){
    return $resource(site_url+'api/accounts/:accountId/names/', {}, {
        list: {method:'GET', params:{}, isArray:true}
    });
});

called like so

$scope.names = Name.list({accountId:$scope.account.id}, function(e){
    console.log(e);
});

traces to

[{"0":"h","1":"e","2":"l","3":"l","4":"o"},{"0":"w","1":"o","2":"r","3":"l","4":"d"}]

Any hints?

解决方案

TLDR; ngResource expects an object or an array of objects in your response.

---

When isArray is set to true in the list of actions, the ngResource module iterates over each item received in the response and it creates a new instance of a Resource. To do this Angular performs a deep copy between the item received and the Resource class, which gives us an object with special methods ($save, $delete and so on)

Check the source here.

Internally angular uses angular.copy to perform the deep copy and this function only operates with objects and arrays, when we pass a string, it will treat it like an object.

Strings in JS can behave as arrays by providing sequential access to each character. angular.copy will produce the following when passed a string

angular.copy('hi',{})   => {0:'h', 1:'i'}

Each character becomes a value in an object, with its index set as the key. ngResource will provide a resource with properties 0 and 1.

---

Your choices are:

Use the lower level $http service

$http.get('/res').success(function(data){
  $scope.test = data;
});

Return an array of objects in your json response

[{'data': "hello"}, {'data': "world"}] 

Intercept the response and change your data

If you cannot modify the data the server sends back and want to use ngResource you will need to transform the response. Read how to do it here

这篇关于被角度资源解析为二维的一维字符串数组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！