如何在angularjs中合并两个对象数组？答案

【问题标题】：How merge two objects array in angularjs?如何在angularjs中合并两个对象数组？
【发布时间】：2015-07-09 00:44:36
【问题描述】：

我想在 angulajs 中将以下对象数组附加到现有的对象数组中，以实现加载更多功能。

即，每次都将 AJAX 响应附加到现有的响应中。

我有一个变量，$scope.actions，其中包含以下 JSON 数据，

    {
    "total": 13,
    "per_page": 2,
    "current_page": 1,
    "last_page": 7,
    "next_page_url": "http://invoice.local/activities/?page=2",
    "prev_page_url": null,
    "from": 1,
    "to": 2,
    "data": [
        {
            "id": 2108,
            "action_type_id": 202,
            "user_id": 1
        },
        {
            "id": 2108,
            "action_type_id": 202,
            "user_id": 1
        }
    ]
}

我想在每次此变量时附加以下JSON 响应。

    {
    "data": [
        {
            "id": 2108,
            "action_type_id": 202,
            "user_id": 1
        },
        {
            "id": 2108,
            "action_type_id": 202,
            "user_id": 1
        }
    ]
}

我试过$scope.actions.data.concat(data.data);

但它不工作并收到以下错误消息

$scope.actions.data.concat is not a function

【问题讨论】：

Angular 同时拥有复制对象的extend 和copy
stackoverflow.com/questions/19765283/…
由于新变量与第一个示例中的data 属性完全相同，因此进行一些说明会有所帮助
docs.angularjs.org/api/ng/function/angular.copy

标签： javascript jquery angularjs merge append

【解决方案1】：

你可以使用angular.extend(dest, src1, src2,...);

在你的情况下是：

angular.extend($scope.actions.data, data);

在此处查看文档：

https://docs.angularjs.org/api/ng/function/angular.extend

否则，如果你只从服务器获取新值，你可以这样做

for (var i=0; i<data.length; i++){
    $scope.actions.data.push(data[i]);
}

【讨论】：

你不能提供更多信息吗？
`angular.extend($scope.actions, data);它正在替换不附加:(
尝试第二种方法时，出现错误Error: $scope.actions.data.push is not a function
我认为你应该尝试这样做angular.extend({}, $scope.actions.data, data); 。 docs.angularjs.org/api/ng/function/angular.extend。这对我有很大帮助，也对我有用。
angular.extend() 是一个浅拷贝，在一般情况下会失败（任意复杂对象的数组）。 angular.merge() 实现了深拷贝，但在粗略测试期间也失败了......我选择了直接解决方案： src.forEach(function (x) { dst.push(x); });将 src 合并到 dst 中。

【解决方案2】：

这对我有用：

$scope.array1 = $scope.array1.concat(array2)

在你的情况下是：

$scope.actions.data = $scope.actions.data.concat(data)

【讨论】：

@davidH 如果您只想将两个数组拼凑在一起，这才是正确的答案。如果数组的键只是一个任意索引号，则非常理想。但是，对于问题中的实际示例，每个项目都返回一个特定的 ID，因此在这里合并或扩展更好，以避免结果数组中的重复。
这对我不起作用。我在 ng-repeat 中使用 $scope.actions.data，控制台中的值正在更新，但视图文件中没有。

【解决方案3】：

$scope.actions.data.concat is not a function

和我一样的问题，但我解决了这个问题

 $scope.actions.data = [].concat($scope.actions.data , data)

【讨论】：

【解决方案4】：

简单

var a=[{a:4}], b=[{b:5}]

angular.merge(a,b) // [{a:4, b:5}]

在 Angular 1.4.1 上测试

【讨论】：

与 extend() 不同，merge() 递归地下降到源对象的对象属性中，执行深层复制。