AngularJS中如何获取ng-repeat表格td内ng-model的绑定值

你的问题根源在于ng-repeat会创建独立的子作用域，你把pay、insure、cash直接绑定为子作用域变量，而非绑定到ng-repeat循环的每个s对象上。这些变量仅存在于每个<tr>对应的子作用域中，无法通过$scope直接访问，且多行的输入值会互相覆盖，最终导致打印时出现undefined。

修复步骤： #

1. 修改HTML模板，将输入框绑定到循环对象的属性上

把每个输入框的ng-model改为s.pay、s.insure、s.cash，确保每个子服务的修改值都存储在自身对象中；同时修正ng-selected的写法（Angular指令内无需用{{}}包裹表达式）：

<table class="table table-bordered table-condensed">
  <thead>
    <tr>
      <th style="text-align: center;">
        <input type="checkbox" />
      </th>
      <th style="width: 60%;">
        Sub Service
      </th>
      <th>
        Payment
      </th>
      <th>
        Insure
      </th>
      <th>
        Cash
      </th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="s in subServices">
      <td style="text-align: center;">
        <input type="checkbox" ng-model="s.details" />
      </td>
      <td>
        {{s.SUBSERVNAME_L}}
      </td>
      <td>
        <select ng-model="s.pay">
          <option value="0">Choose</option>
          <option ng-repeat="p in payTypes" value="{{p.payid}}" ng-selected="p.payid == s.pay">{{p.paynm}}</option>
        </select>
      </td>
      <td>
        <input class="form-control input-sm" type="number" ng-model="s.insure" />
      </td>
      <td>
        <input class="form-control input-sm" type="number" ng-model="s.cash" />
      </td>
    </tr>
  </tbody>
</table>

2. 修改JS的save函数，从每个选中的对象中获取值

遍历subServices时，直接从选中的s对象里读取pay、insure、cash属性，而非访问$scope上的全局变量：

$scope.subSrvData = [];
$scope.save = function () {

    $scope.subServices.forEach(function (s) {
        if (s.details == true) {
            console.log(s);
            $scope.subSrvData.push({ 
                Main_Serv: $scope.mainSrv, 
                Sub_Serv: s.SUB_SERV, 
                InsuredAmt: s.insure, 
                CashAmt: s.cash, 
                Perc_Amt: s.pay
            });
        }
    });

    console.log($scope.subSrvData);

    var promisepost = NetRevenueSetupSrv.deleteSubs("NetRevenueSetup/deleteSubs?mainSrv=" + $scope.mainSrv);
    promisepost.then(function (response) {
        var _response = response.data;
        if (_response.Value == -1) {
            toastr['error'](_response.Message);
            return;
        }
        var promisepost = NetRevenueSetupSrv.save("NetRevenueSetup/save", $scope.subSrvData);
        promisepost.then(function (response) {
            var _response = response.data;
            if (_response.Value == -1) {
                toastr['error'](_response.Message);
                return;
            }
            toastr.success("Successfully Saved");
        });
        $scope.subSrvData = [];
    });
};

额外优化建议 #

对于<select>，推荐使用Angular的ng-options指令替代ng-repeat渲染选项，写法更简洁且符合Angular最佳实践：

<select ng-model="s.pay" ng-options="p.payid as p.paynm for p in payTypes">
  <option value="0">Choose</option>
</select>

内容的提问来源于stack exchange，提问作者user18321425