javascript - Angular : Why is my event handled twice?

Question

我有三个 Controller :main、product、customer。 Controller A 是我的“主页”的一部分。 Controller B 和 C 取决于位置。

Controller 主要:

var MainController = function ($scope, $location, $rootScope, ToolbarService) {
    $scope.addClicked = function () {
        ToolbarService.onAddButtonClick();
    };
};

app.controller({ MainController: MainController });

产品:

var ProductController = function ($scope) {

    $scope.$on('handleAddButtonClick', function () {
        alert('Add product');
    });
};
app.controller({ ProductController: ProductController });

顾客:

var CustomerController = function ($scope) {

    $scope.$on('handleAddButtonClick', function () {
        alert('Add customer');
    });
};
app.controller({ CustomerController: CustomerController});

工具栏服务:

app.service({
    ToolbarService: function ($rootScope) {
        return {
            onAddButtonClick: function () {
                $rootScope.$broadcast('handleAddButtonClick');
            }
        };
    }
});

当我的位置是 #/products 并且调用 main 的 addClicked 时，我收到两次“添加产品”警报。有人知道这是为什么吗？

Answer 1

问题是我还在路由中声明了一个 Controller 。所以我在我的 html 页面上配置了一个 Controller ，在路由提供者中配置了一个。这导致一切都执行了两次..