表單不發送更新的輸入值

Question

在我的頁面上有bs表。 數據來自api調用。 通過單擊行，我發送新的api調用以從db檢索行數據。 然后我為res數據設置范圍變量並將其呈現在頁面上

$('#table').on('click-row.bs.table', function (e, row, $element) {

                $('.success').removeClass('success');
                $($element).addClass('success');

                var indexId = $table.find($element).data('index');
                var rowData = $table.bootstrapTable('getData')[indexId];
                $scope.id = rowData.id;

                $http.get(url + $scope.id)
                        .then(function (res) {
                            $scope.rowData = res.data.model;
                            console.log($scope.rowData);
                            $scope.rowKeys = Object.keys($scope.rowData);
                        });
                $scope.$apply();

            });

的HTML：

<form style="padding: 15px" ng-submit="submitForm()">
        <div class="form-group row">
               <div ng-repeat="k in rowKeys | filter: '!id'" ng-model="rowValue">
               <label for="rowValue"  class="col-sm-2">
               <!--{{k | hide:'.name'}}:-->
               {{k }}:
               </label>
               <div class=" col-sm-2">
               <input class="form-control rowValue"  id="rowValue"  value="{{rowData[k]}}"/>
               </div>
          </div>
    </div>
   <button type="submit" class="btn btn-default" ng-if="rowData" >Submit</button>

然后通過ng-submit，我要發回以該形式進行的更改

 $scope.submitForm = function() {

        $scope.$watch('rowData', function(newValue, oldValue) {
                console.log('being watched oldValue:', oldValue, 'newValue:', newValue);
            }, true);

        $http({
            method  : 'PUT',
            url     : url + $scope.id,
            data    : $scope.rowData, //form
            headers : {'Content-Type': 'application/json'}
        })
        .then(function (res) {
                //console.log(res);
                //console.log($scope.rowData);
                return res;
            });
    };

如您所見，我已將$ watch設置為跟隨作用域變量的更改，但是問題是控制台日志為oldValue和newValue返回相同的值。 誰能解釋我的錯誤在哪里？ 感謝您的幫助

Answer 1

您沒有將值綁定到任何東西。 代替在輸入元素上使用value="{{rowData[k]}}" ，請使用ng-model： ng-model="rowData[k]" 。

Answer 2

您正在調用$scope.$apply(); 在請求有機會完成之前。 您需要放入$scope.$apply(); 在 then()回調中。

$http.get('stuff').then(function(response){
    //stuff
    $scope.$apply();
});