javascript - 所有 $watch 执行后的 AngularJS Controller 事件

Question

在所有 Controller 匹配器执行后是否可以触发一个事件(仅一次)？

例如:

$scope.$watch 'var1', (value) ->
  # Do something ...
  callEvent()

$scope.$watch 'var2', (value) ->
  # Do something ...
  callEvent()

$scope.$watch 'var3', (value) ->
  # Do something ...
  callEvent()

$scope.$watch 'var4', (value) ->
  # Do something ...
  callEvent()

就我而言，callEvent() 触发了 4 次，但我只需要一次。

我还可以更改我的业务应用程序逻辑，但这将是一个非常长期的过程。

Answer 1

一种方法是进行额外的深度观察(不懂 CS，代码将在 JS 中):

$scope.$watch(
    function() {
        return {
            var1: $scope.var1,
            var2: $scope.var2,
            var3: $scope.var3,
            var4: $scope.var4
        };
    },
    function(newval) {
        callEvent();
    },
    true // deep watch
);

请再次注意，每个摘要周期都会触发该事件一次!

另一种方法是使用标志 - 需要超时重置(丑陋):

var flag = false;

$scope.$watch('var1', function(newval) {
    // Do something
    callEventOnce();
});

// same for var2, 3, 4

function callEventOnce() {
    if( !flag ) {
        flag = true;
        $timeout(function() {
            flag = false;
        });
        callEvent();
    }
}

避免超时丑陋的一种方法是让 Controller 监听事件，然后重置标志。例如，如果实现了 callEvent()如:

// HYPOTHETICAL IMPLEMENTATION OF callEvent()
function callEvent() {
    $rootScope.$broadcast('my_event');
}

将其添加到 Controller :

$scope.$on('my_event', function() {
    flag = false;
});