Question

我正在创建可编辑的表格，在编辑所有行成为输入字段时，如何只选择我点击的一行？

这是我的一张表

<table>
 <tr ng-repeat="item in data track by $index">
   <td>
      <span ng-if="!editing">{{item.username}}</span>
      <span ng-if="editing">
         <!-- If I use ng-if="editing && index == $index" than all other fields disappear -->
         <input type="text" name="name" class="form-control" ng-model="item.username">
      </span>
   </td>
   <td>
      <div ng-if="!editing">
         <button ng-click="edit()" >Edit</button>
      </div>
   </td>
 </tr>
<table>

控制器：

.controller('formCtrl', function($scope) {

        $scope.editing = false;
        $scope.index = "";
        $scope.edit = function(index) {
            $scope.editing = true;
            $scope.index = index;
        };

Answer 1

点击

传递索引

试试这个

<button ng-click="edit($index)" >Edit</button>

或对象本身

<button ng-click="edit(item)" >Edit</button>

JSFIDDLE

Answer 2

在编辑模式下，您必须检查当前项目的索引是否为版本中的项目：

<span ng-if="!editing || index!=$index">{{item.username}}</span>
<span ng-if="editing && index==$index">
    <input type="text" name="name" class="form-control" ng-model="item.username">
</span>

参见工作JsFiddle：http://jsfiddle.net/805rt1wd/1/

如何在使用angular进行编辑时选择表中的确切行？

2 个答案: