Как добавить данные к конкретному индексу массива json с помощью angularjs

Question

Я создал данные таблицы и кнопку редактирования, и я получаю проблему, когда пытаюсь добавить данные редактирования в определенную строку.

Вот мой 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 [я] .С" является а не функция Есть ли альтернативный способ добавления данных к определенному индексу массива?

Answer 1

Я думаю, что вы имеете в виду:

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

Или

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

Answer 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