angularjs - 切换或禁用/重新启用 AngularJS 监视

Question

我需要能够在执行特定任务时忽略特定的 watch 。这是场景。

<小时/>

我有几个观察者关注用于计算“总计”字段的字段。

所有这些字段都可以手动修改，这将触发计算“总计”字段的监视。

这些字段也可以从保存的状态加载，这也会触发计算“总计”字段的监视。

“总计”字段也可以手动覆盖、保存和加载。

当手动覆盖的“总计”字段与其他字段一起加载时，会出现此问题。重新计算“总计”的监视被触发，并覆盖手动覆盖的“总计”。

我需要能够在负载发生时忽略 watch 。有什么办法可以做到这一点吗？

我知道可以使用创建监视时传回的取消注册功能来禁用监视程序，但是当您重新创建监视程序时，它仍然知道它正在监视的数据已更改。

注意:这是对围绕该问题的业务逻辑的过于简单的描述。无法禁用 watch 需要大量的工作。

这是一个显示问题的 fiddle :jsfiddle.net/vGWZy/1/

Answer 1

您可以将观察者的回调和禁用程序存储在特殊服务中，并使用服务方法的绑定(bind)和取消绑定(bind)它们

您的代码示例 http://jsfiddle.net/snicksnk/66osj8zm/

//Service for working with watcher's binding
var watchService = {
    watchers: {},
    create: function(name, callback){

        watchService.watchers[name] = 
        {
            'callback': callback,
            'disableCallback': null
        };
    },
    enable: function($scope, name){
        if (typeof watchService.watchers[name]['callback'] !== 'function'){
            return;
        }
        watchService.disable(name);
        var watcher = watchService.watchers[name]['callback'];
        watchService.watchers[name]['disableCallback'] = $scope.$watch(name, watcher, true);


    },
    disable: function(name){
        if (typeof watchService.watchers[name]['disableCallback'] !== 'function'){
            return;
        }
        watchService.watchers[name]['disableCallback']();
    }
};

//Creating of watcher's callbacks, instead of using $scope.$watch directly
watchService.create('item.value1',  function() {
    $scope.item.total = $scope.item.value1 * $scope.item.value2;
});


watchService.create('item.value2',  function() {
    $scope.item.total = $scope.item.value1 * $scope.item.value2;
});



//Wathcers enabler
$scope.enableWatchers = function(){
    watchService.enable($scope, 'item.value1');
    watchService.enable($scope, 'item.value2');
};

//Wathcers disable
$scope.disableWatchers = function(){
    watchService.disable('item.value1');
    watchService.disable('item.value2');
};