如何使用angularjs将数据添加到json数组的特定索引答案

【问题标题】：How to add Data to Specific index of json array using angularjs如何使用angularjs将数据添加到json数组的特定索引
【发布时间】：2016-05-16 14:38:32
【问题描述】：

我创建了表格数据和编辑按钮，当我尝试将编辑数据添加到特定行时遇到问题。

这是我的 plunkr :- http://plnkr.co/edit/QKz7nu458i8Il4OLmAyw?p=preview

这里是 HTML 页面

    <table class="table table-bordered">
                <thead>
                    <tr>
                        <th><input type='checkbox' ng-modal='isall' ng-click='selectallrows()'></th>
                        <th>ID</th>
                        <th>Name</th>
                        <th>EDIT</th>

                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat='p in person' ng-class="{'success':tableselection[$index]}">
                        <td><input type='checkbox' ng-model='tableselection[$index]'></td>
                        <td>{{p.id}}</td>
                        <td>{{p.name}}</td>
                        <td><button class='btn btn-primary' ng-click='edit(p.id)'><span class="glyphicon glyphicon-pencil"></span>Edit</button></td>
                    </tr>
                </tbody>

            </table>
<div ng-show='editabledata'>
      <form role='form' class='form-horizontal'>

        <div class='form-group'>
      <label>Id :-</label>
      <input type='text' ng-model='pid' class='from-group col-sm-2'></div>
      <div class='form-group'>
      <label>Name:-</label>
      <input type='text' ng-model='pname' class='from-group col-sm-2'>
      </div>
      <button class='btn btn-primary' ng-click='saveeditdata(pid)'>Save</button>
      <button clas='btn btn-primary' ng-click='canceleditdata()'>Cancel</button>
      </form>
    </div>

这是我的 .js

$scope.person=[
        {id:1,name:'devendher'},
        {id:2,name:'Macha'},
        {id:3,name:'Macha devendher'}
        ];

    $scope.editabledata=false;
  $scope.edit=function(id){
    $scope.editabledata=true;

   for(i=0;i<$scope.person.length;i++){

     if($scope.person[i].id==id)
   {
     $scope.pid=$scope.person[i].id;
     $scope.pname=$scope.person[i].name;
   }

   }
  }


  $scope.saveeditdata=function(id){
    for(i=0;i<$scope.person.length;i++){
      if($scope.person[i].id==id){
        $scope.person[i].push({'id':$scope.pid,'name':$scope.pname})
      }
    }


  }

我收到错误“$scope.person[i].push”不是函数有没有其他方法可以将数据添加到数组的特定索引？

【问题讨论】：

标签： javascript angularjs json

【解决方案1】：

我想你的意思是：

$scope.person.push({...})

或者

$scope.person[i] = {...}

【讨论】：

【解决方案2】：

这非常复杂，您没有利用对表单数据使用单个对象。此外，您对编辑对象和原始对象使用不同的属性名称。你做的所有循环都是不必要的

更简单的步骤：

要编辑对象，将整个对象传递给控制器函数：

  <button  ng-click='edit(p)'>

在控制器中复制对象并存储对所选对象的引用以供以后更新

$scope.edit=function(person){ 
   $scope.editabledata = true;
   $scope.selectedItem = person;
   $scope.editItem = angular.copy(person);
}

在编辑表单中使用ng-model 中的完整对象引用。无需创建单独的变量，使用已经存在的属性

ID :  <input ng-model="editItem.id">
Name: <input ng-model="editItem.name">

在保存函数中用更新的对象扩展原始对象

$scope.saveeditdata=function(){
   // merge updates
   angular.extend($scope.selectedItem , $scope.editItem);
   // reset
   $scope.editabledata = false;
   $scope.editItem = {};

}

删除见：How do I delete an item or object from an array using ng-click?

DEMO

【讨论】：

是的，非常感谢:)