Question

我有一个带有数量的项目列表，其中一些已经有一个在页面加载时从资源中检索的数量。然后，我会观察相同的字段，以便用户进行任何更改，以便能够自动保存这些更改。自动保存过程非常有效，但事实是，当数量由资源提交时触发监视，我不愿意，因为将这些信息反馈给服务器是愚蠢的。

你会怎么做？：）

app.controller('InventoryLineController', function($scope, inventoryService){
  // Populate les champs de lignes déjà enregistrés sur le serveur.
  inventoryService.getLine($scope.inventory, $scope.product).$promise.then(function(inventoryLine){
    $scope.quantity = inventoryLine.quantity;
  });

  // Sauvegarde automatique lors du changement de quantité.
  $scope.$watch('quantity', function(newVal, oldVal){
      console.log(newVal); // VALIDATIONS + CALL TO SAVE METHOD
  });
});

这是html：

<tr ng-repeat="product in productList" ng-controller='InventoryLineController'>
  <input type="number" class="form-control" name="quantity" value="{{quantity}}" min="0" smartFloat ng-model-options="{ updateOn: 'blur' }" ng-model="quantity">
</tr>

感谢的！

Answer 1

如果newval等于old val

，则可以忽略newval

   $scope.$watch('quantity', function(newVal, oldVal){
     if(newVal !== oldVal) {
        console.log(newVal); // VALIDATIONS + CALL TO SAVE METHOD
     }
  });

Answer 2

您可能必须单独存储来自资源的响应，并使用它来与newVal进行比较（如果它已更改）。例如：

app.controller('InventoryLineController', function($scope, inventoryService){
  var savedObj = {};

  // Populate les champs de lignes déjà enregistrés sur le serveur.
  inventoryService.getLine($scope.inventory, $scope.product).$promise.then(function(inventoryLine){
    savedObj = inventoryLine;
    $scope.quantity = inventoryLine.quantity;
  });

  // Sauvegarde automatique lors du changement de quantité.
  $scope.$watch('quantity', function(newVal, oldVal) {
    if (angular.equals(newVal, savedObj.quantity)) {
      return;
    }

    savedObj.quantity = newVal;
    console.log(newVal); // VALIDATIONS + CALL TO SAVE METHOD
  });
});

希望这有帮助。

防止资源数据触发$ watch（Angular.js）

2 个答案: