如何在数组特定索引处插入数组,而不使用angular删除指定索引处的现有数据

时间:2015-12-29 15:06:57

标签: javascript arrays angularjs json

我有一个数组,在该数组中,如果条件满足,我想在特定索引上添加另一个数组。

这是我的控制者:

var app = angular.module('rulesApp');
app.controller('myController2', ['$scope', '$rootScope'] {
      $scope.rows = function() {
        $rootScope.rows.push({
          id: $rootScope.input_columns.length,
          name: 'Name'
          dropped: false,
          dataType: '',
          type: 'input',
          path: ''
        }); //Json in which I need to add array
        //some code
        for (var i = 0; i < cellValues.length; i++) {
          for (var j = 0; j < $rootScope.input_columns.length; j++) {
            $rootScope.rows.splice(j, 0, cellValues); //I want to add
            cellValues array to rows Json on specified index
          }
        }
      });

附加初始对象的图像

enter image description here

拼接后:

enter image description here

这里我有两个元素的数组,我想在指定的索引上添加另一个数组,也包含现有数据。为此我尝试了很多解决方案然后尝试与splice拼接,它正在删除现有索引并添加新索引。但我希望在指定的索引上我可以添加数组而不覆盖以前的数据。我尝试使用$rootScope.rows[i].push(cellValues),但它正在提供error: function not defined

如何在不覆盖现有数据的情况下在JSON中插入数组数据。我附上了两个截图,以便更好地理解我面临的问题

有没有办法在指定的索引处我可以插入带有现有数据的cellValue数组

这是在尝试切片代码后创建的结构。现在,单元格值数组在1-3索引上创建,然后在第4&amp;第五指数以前的数据即将到来。但我想用现有数据将cellValues数据添加到指定的索引本身。

enter image description here

3 个答案:

答案 0 :(得分:0)

首先,我发现您的代码存在各种问题。

<强>熔接

基本上你在这里做的是在一个对象数组中添加一个字符串数组。

$rootScope.rows=[{...}, {...}];
cellValues=["some", "value"];

$rootScope.rows.splice(j, 0, cellValues);

console.log($rootScope.rows) //[{...}, {...}, ["some", "value"]]

<强>熔接

rowValues=$rootScope.rows.slice(0,j).concat(cellValues, rowValues);

此处您将删除所有数组项目直到索引j。然后将这些与cellValues合并,就像上面的示例一样,将返回一个字符串和对象数组的混合数组:

[["some", "value"], {...}, {...}]

解决方案

如果我理解你是正确的,你想要合并(concatinate)到数组。这可以完成如下:

数组合并

$rootScope.rows=$rootScope.rows.concat(cellValues);

实施例

var rows=[1,2,3];

var cellValues=[4,5,6];

var newRow=rows.concat(cellValues);

console.log(newRow); //[1,2,3,4,5,6]

对象合并

如果你需要合并两个对象(关联数组),你可以使用angular.extend(obj1, obj2)

实施例

var obj1={
  one:1,
  two:2,
  three:3
}

var obj2={
  four:4,
  five:5,
  six:6
}

var obj3=angular.extend(obj1, obj2);

console.log(obj3);
/*
  {
    one:1,
    two:2,
    three:3,
    four:4,
    five:5,
    six:6
  }
*/

Jsbin example here

更新

由于您有一个给定的索引(j),您必须使用它来识别rows数组上的某个嵌套数组。然后你要将识别的嵌套数组与新数组(cellValues)合并;

实施例

//nested arrays
var rows=[
  [1,2,3,4],
  [5,6,7,8],
  [9,10,11,12],
  [13,14,15,16],
];

//index of the nested array to merge
var arrayIndex=1;

//new array to merge with nested array (rows[arrayIndex])
var valuesToAdd=[22,33,44];

//Reference the nested array and merge it with the new array.
rows[arrayIndex]=rows[arrayIndex].concat(valuesToAdd);

console.log(rows[arrayIndex]); //[5, 6, 7, 8, 22, 33, 44]

Jsbin example

但是,在您的情况下,您希望将cellvalues字符串数组中的值添加到rows数组中的已标识对象。这可以通过两种方式完成:1)将path属性添加到标识的对象,或者2)将每个字符串作为属性添加到标识的对象。

选项1:

for (var j = 0; j < $rootScope.input_columns.length; j++) {
    rows[j].paths=cellValues;
}

选项2:

for (var j = 0; j < $rootScope.input_columns.length; j++) {
    for(var i=0;i<cellValues.length; i++) {
        rows[j]["path"+i]=cellValues[i];
    }
}

Jsbin example

答案 1 :(得分:0)

角度中的数组表现相同。他们有相同的原型方法,如切片,拼接。只需将您的数组设置为示例中的a,b,d即可,它将适合您。

&#13;
&#13;
a = [1, 2, 5], 
  b = [3, 4], 
  indexWhereToInsert = 2, //postion where you want to insert (index +1 ) actually 
  d = [];

d = a.slice(indexWhereToInsert, a.length)
alert(a.slice(0, indexWhereToInsert).concat(b, d))
&#13;
&#13;
&#13;

答案 2 :(得分:0)

我在$ rootScope.rows Json里面创建了一个数组:

$scope.rows = function() {
        $rootScope.rows.push({
          id: $rootScope.input_columns.length,
          name: 'Name'
          dropped: false,
          dataType: '',
          type: 'input',
          path: '',
          rowValue:[]
        }); //Json in which I need to add array
        //some code
        for (var i = 0; i < cellValues.length; i++) {
          for (var j = 0; j < $rootScope.input_columns.length; j++) {
            $rootScope.rows[j].rowValue.push(cellValues); //I am able to get array inside an array at specified index

          }
        }
      });