按钮单击Angularjs排列列表列表

时间:2017-07-10 07:30:24

标签: angularjs nested-lists custom-lists

我有数据,带有按钮的两个输入字段,点击按钮我要将数据移动到某个位置:

两个输入字段 =来源和目的地它基本上是将某个项目从源位置移动到目标位置的索引

data =

        {
      "0": [
        {
          "key": "Survey Meta Data"
        }
      ],
      "1": [
        {
          "key": "New Section"
        }
      ],
      "2": [
        {
          "key": "Tax Authority"
        }
      ]
    }

解释我想要的东西     输入字段来源 = 2 目的地 = 0     现在我的数据将是

    {
  "0": [
    {
      "key": "Tax Authority"
    }
  ],
  "1": [
    {
      "key": "Survey Meta Data"
    }
  ],
  "2": [
    {
      "key": "New Section"
    }
  ]
}

当它被移动到第一个索引并且其他项被推送 任何帮助将不胜感激

的index.html

Source=<input  ng-model="source" type="number>
Destination<input ng-model="destination" type="number>
<button ng-click="arrange(source,destination)></button>
{{model|json}}

index.js

$scope.model=[[{"key":'Survey Meta data'}],[{key:'New Section'}],[{key:Tax Authority'}]]

$scope.arrange(src,dest)
{
//trick to push
}

1 个答案:

答案 0 :(得分:1)

您只需使用splice即可实现此目标。

<强> JS

   $scope.myObj = {
    "0": [{
        "key": "Survey Meta Data"
    }],
    "1": [{
        key: 'New Section'
    }],
    "2": [{
        "key": "Tax Authority"
    }]
};
$scope.model = [];
for (var i in $scope.myObj) {
    if ($scope.myObj.hasOwnProperty(i)) {
        $scope.model.push($scope.myObj[i]);
    }
}
Array.prototype.insert = function(index, item) {
    this.splice(index, 0, item);
};
$scope.arrange = function(src, dest) {
    var temp = [];
    temp = $scope.model.splice(parseInt(src), 1);
    $scope.model.insert(parseInt(dest), temp[0]);
    for (var i = 0; i < $scope.model.length; i++) {
        $scope.myObj[i] = $scope.model[i];
    }
}

<强>演示http://jsfiddle.net/yj9sswq1/5/