避免$watch在控制器实例化时触发

Question

我有这个控制器：

  .controller('MasterAdminUserIdCtrl', function ($scope, user) {
    $scope.user = user;
    $scope.userWasEdited = false;

    $scope.$watch('user', function(){
      $scope.userWasEdited = true
    }, true);

我想检查用户是否更改了用户的任何数据，所以我有一个手表。问题是当控制器实例化时，手表总是会触发。解决这个问题的最佳方法是什么？

Answer 1

检查是否有更改：

$scope.$watch('user', f, true);
function f(newValue, oldValue){
    // here you can add some conditions using oldValue & newValue. E.g:
    if ( oldValue !== newValue ) {
        $scope.userWasEdited = true;
    }
}

Answer 2

如果我的模型中没有太多数据，我喜欢存储一个副本，并设置一个监视，通过比较新值和旧值来更新标志。这允许用户撤消或更改原始值，而不必看到存在未保存更改的警告。

当我从服务器获取模型的angular.copy()或将其保存到服务器时，我会将其存储在lastModel中，并设置一个手表，在每个摘要周期执行比较函数，当值发生变化时调用第二个函数以设置isChanged标志：

$scope.model = Model;
$scope.lastModel = angular.copy($scope.model);
$scope.$watch(function () {
    currentJSON = angular.toJson($scope.model);
    lastJSON = angular.toJson($scope.lastModel);
    var changed = currentJSON != lastJSON;
    return changed;
}, function (newValue, oldValue) {
    $scope.isChanged = newValue;
});

这样，我就不必关注每一个单独的更改，它将100%捕捉到我将发布回服务器的对模型所做的任何更改。

我刚刚在一个页面上测试了angular.toJson()的速度，一个有一个相当简单的对象和三个总共有100个对象的数组的模型在大约0.35毫秒内生成9.5kb的JSON。因此，两个数组的0.70毫秒意味着你可能有一个有2000多个对象的模型，但它仍然需要不到1/60秒的时间，至少在计算机上是这样。如果你观察所有这些值的个体变化，我想这将需要更多的时间，因为angular在每个周期都会做类似的事情来寻找变化。