如何跟踪 $scope.$broadcast 上的事件？

Question

我正在使用 angular-timer，但我对如何跟踪它的事件有点困惑。例如，我想在时间结束后做一些事情，但是我在控制台日志上看不到任何事件。

  vm.add20Seconds = function() {
    $scope.$broadcast('timer-add-cd-seconds', 20);
  }

  $scope.$on('timer-add-cd-seconds', function (event, data) {
    console.log(data); // 'Some data'
  });

控制台是空的。

https://github.com/siddii/angular-timer/blob/master/examples/angularjs-add-countdown-seconds.html

Answer 1

由于 link 中给出的代码似乎没有更新，我认为您将其更改为使用 controllerAs 语法。因此，您的 button html 将在调用控制器方法时使用 vm 别名。假设您使用 ng-controller="MyAppController as vm"

标记

<button type="button" ng-click="vm.add20Seconds()">Add 20 Seconds</button>

否则想在控制器中使用 $scope 然后只需将方法更改为 $scope.add20Seconds 而不是 vm.add20Seconds

更新

要在 20 秒后调用函数，您可以在此处使用 $timeout 服务，该服务将在提及 $timeout 完成时调用并指定回调。

代码

vm.add20Seconds = function() {
   $scope.$broadcast('timer-add-cd-seconds', 20);
}

var myCallbackAfterTimeout = function(){
   //add your code.
}

$scope.$on('timer-add-cd-seconds', function (event, data) {
 console.log(data); // 'Some data'
 $timeout(myCallbackAfterTimeout, data); //data is nothing but timeout milliseconds
});

Include $timeout dependency in your controller before using it.

Answer 2

如果您正在寻找一篇关于在 angularJS 中使用范围树作为发布和订阅 (Pub/Sub) 机制的好文章，请查看此 link

如何跟踪 $scope.$broadcast 上的事件？

How to track events on $scope.$broadcast?

broadcast

angularjs

angular-broadcast