javascript - 当 ng-repeat 位于 <tr> 标签上时，如何检测单击了哪个表行 | Angularjs

Question

我有一个带有输入列的表行，我想获取 td 的值(id)，由于某种原因，我必须通过单击 td 时调用函数来完成此操作

HTML CODE:

<tr ng-repeat="fr in nonConfirmedFactureRetour">
    <td> 
//storing id in the data-item Attr.

        <input id="pending_item_name" data-item="{{fr.id}}" value="{{fr.facture_item_name}}" type="text"/>
    </td>
    <td>
        <input id="pending_cls_crt" value="{{fr.fcls_crt}}"  type="text"/>
    </td>
    <td>
        <input id="pending_piece" value="{{fr.fpiece}}"  type="text"/>
    </td>
    <td>
        <input id="pending_dateCom" value="{{fr.dateCom}}"  type="text"/>
    </td>
    <td>
        <input id="pending_dateRec" value="{{fr.dateRec}}"  type="text"/>
    </td>
    <td>
// calling function to hget the id 
        <input ng-click="confirmEntity_retour();" type="button" value="Confirm"/>
    </td>
</tr>

JS 代码:

$scope.confirmEntity_retour=function(){
            var item_nameId=$("#rfi").attr("data-itid");
            alert(item_nameId); //alert the id when calling this function
}

我希望获得输入属性的 id。当点击提交时 但问题是，无论点击什么 td，我总是得到第一个 id

Answer 1

使用 JQuery 从 DOM 获取数据违反了 AngularJS 的范式。您应该改用数据绑定(bind)。您可以将项目的 ID 作为参数传递给 confirmEntity_retour 函数。

HTML 模板:

<input ng-click="confirmEntity_retour(fr.id);" type="button" value="Confirm"/>

Controller :

$scope.confirmEntity_retour = function(id) {
  alert(id);
}