在 ng-repeat 中获取输入的更新值 |角JS答案

【问题标题】：getting the updated value of inputs in ng-repeat | Angular Js在 ng-repeat 中获取输入的更新值 |角JS
【发布时间】：2018-01-31 23:34:10
【问题描述】：

我在一个用 ng-repeat 填写的表格中有一个输入，我希望能够一键获取所有输入的更新值。

我的观点：

<tr ng-repeat="sf in selectedFacture">

        // displaying default values in the input
        <td><input class="facture_item_name" ng-model="sf.facture_item_name" value="{{sf.facture_item_name}}" type="text"/></td>
        <td><input class="fcls_crt" ng-model="sf.fcls_crt" value="{{sf.fcls_crt}}"  type="number"/></td>
        <td><input class="fpiece" ng-model="sf.fpiece" value="{{sf.fpiece}}" type="number"/></td>
        <td colspan="4"><input type="text" class="form-control note" ng-model="sf.note" value="{{sf.note}}"/></td>
    <tr>
        <td ng-click="updateFacture(sf.id,sf,sf.facture_type,sf.item_id)">SUBMIT</td>
    </tr>
</tr>

JS：

// getting new values and send them to server side
$scope.updateFacture=function(id,sf,type,item_id){
        var url = '../php/history.php';
        var func = "updateFacture";

        sf = sf || {};
        var editedQuanCls= sf.fcls_crt,
        editedQuan_piece= sf.fpiece,
        editedQuan_cls_crt_gate= sf.fcls_crt_gate,
        editedQuan_piece_gate= sf.fpiece_gate,
        editedNote= sf.note;

        var data = {"function": func,
            "factureId":id,
            "item_id":item_id,
            "facture_type":facture_type,
            "editedQuanCls":editedQuanCls,
            "editedQuan_cls_crt_gate":editedQuan_cls_crt_gate,
            "editedQuan_piece":editedQuan_piece,
            "editedQuan_piece_gate":editedQuan_piece_gate,
            "editedNote":editedNote};

        var options = {
            type : "get",
            url : url,
            data: data,
            dataType: 'json',
            async : false,
            cache : false,
            success : function(response,status) {
                alert("success")
            },
            error:function(request,response,error){
                alert("errro: " + error)
            }
        };
        $.ajax(options);
    }

我尝试将更新后的按钮放在输入旁边的 td 中，它工作正常，但这会单独更新每一行，但我需要一键更新它们。

我将附上我的视图的屏幕截图。

提前致谢

【问题讨论】：

不明白你的问题。请更新您的问题
我认为每次点击提交按钮时总是只更新最后一行。我说的对吗？
@Sandeep 没错，我想我会得到数据并将它们存储在一个数组中，但我只得到第一行，我怎样才能得到它们？
@IsraGab 通常我使用 jQuery class/id > $(class/id).val() 获得值，但现在我很困惑如何在每一行只有一个 id 时获取它们并且该行是自动生成的 anf 填充有角度 js ng-repeat

标签： angularjs angularjs-ng-repeat angularjs-ng-model

【解决方案1】：

<input class="facture_item_name" ng-model="sf.facture_item_name" value="{{sf.facture_item_name}}" ng-change="updateValues(sf.facture_item_name)" type="text"/>

$scope.updateValues=function(value){
$scope.sf.facture_item_name=value;
}

【讨论】：

【解决方案2】：

你需要的是一个包装函数。首先在包含 All 选项的页面上添加一个按钮，例如：

 <button ng-click="updateAllFacture()">SUBMIT ALL</button>

然后添加包装函数。所有这些都是遍历列表中的每个项目并调用更新函数。包装函数如下所示：

 $scope.updateAllFacture=function(){

    angular.forEach($scope.res, function(sf, index) {

      $scope.updateFacture=function(sf.id,sf,sf.facture_type,sf.item_id );

    });

  };

如果您有很多项目，那么您的 api 将会有很多回调。考虑将表单中的所有输入作为帖子提交 - 这样只会有一个回调，但您需要为此对控制器进行编程。

【讨论】：