AngularJS - 按钮点击更新动态表中输入框的值

Question

检查了各种Stackoverflow资源后，它看起来像我仍然无法找出这样做的角度方式。只有Id列和另一个文本列（输入框）的HTML表格通过ng-repeat动态填充。然后我为显示在输入框内的每条记录提供“更新”和“删除”功能/按钮。 '删除'功能似乎确定，'删除'按钮点击我只是将ID作为参数传递给函数。使用'update'点击事件时，我不确定如何将输入框的值作为第二个参数传递给函数。请参阅下面的简化标记和代码。

<tr ng-repeat="rec in allRecords"> 
    <td>{{rec.Id}}</td> 
    <td> 
     <button ng-click="update(rec.Id, HERE_TEXT_FROM_SIBLING_INPUT')">Update</button> 
     <input type="text" value="{{rec.Name}}"> 
     <button ng-click="deleteMonitorGroup(rec.Id)">Delete</button> 
    </td> 

而且控制器

app.controller('MyCtrl', function (MyService, $scope) { 

MyService.listAllRecords(function (allRecs) { 
    $scope.allRecords= allRecs; 
}); 

$scope.update = function (Id, text) { 

     MyService.update(Id, text, function() { 
      // update record 
     }); 
} 

}); 

任何帮助表示赞赏。

Answer 1

使用ng-model有输入字段像ng-model="rec.Name"其保持rec.Name通过角双向绑定feature.Then更新都通过ng-model的rec.Name到更新的功能OR，而只是传递rec对象函数调用，使之更加简单。

标记

<tr ng-repeat="rec in allRecords"> 
    <td>{{rec.Id}}</td> 
    <td> 
     <button ng-click="update(rec)">Update</button> 
     <input type="text" ng-model="rec.Name"> 
     <button ng-click="deleteMonitorGroup(rec.Id)">Delete</button> 
    </td> 
</tr>