$ rootScope。$广播没有在ui路由器中获取

时间:2015-12-01 16:35:41

标签: javascript angularjs angular-ui-router broadcast

我使用ui-router显示2个ui-views,一个在另一个之内。它们的组织方式如下:

.state('itemAbstract', {
    url: '/items',
    abstract: true,
    templateUrl: 'client/views/item.ng.html',
    controller: 'moveCtrl',
})
.state('item', {
    url: "/:itemId",
    parent: "itemsAbstract",
    views: {
        "otherpage":{
            templateUrl: 'client/views/other-page.ng.html',
            controller: 'otherPageCtrl'
        }
    }
})

单击某个项目时,我在otherpage控制器中运行了以下命令。

$rootScope.$broadcast("somethingClicked",obj)

我尝试在item控制器中监听事件:

$scope.$on("somethingClicked",function(a,b){
    console.log(a)
    console.log(b);
})

不幸的是,这个函数永远不会被调用。我尝试将此侦听器函数放在otherpage控制器中,并在事件发生时正确调用它。但是出于某种原因,这个广播并没有跨越范围进行转移。这就是我使用它的全部原因,当点击父级中的某些内容时触发父级中的操作。关于为什么这不起作用的任何想法?

这是我的项目控制器

angular.module('mm').controller('itemCtrl',
function($scope, $meteor, $rootScope, $state, $stateParams) {
    var s = $scope;
    s.rs = $rootScope;

    $scope.$on("somethingClicked",function(a,b){
        console.log("there as a click")
        console.log(a)
        console.log(b);
    })
}

我使用Batarang进行调试,发现尽管有这段代码,$ scope 甚至没有注册事件监听器$scope.$$listeners 会为somethingClicked事件提供监听器。很奇怪,为什么这不起作用也没有意义。

2 个答案:

答案 0 :(得分:3)

也许你有独立的控制器没有应用继承。仅通过在视图上嵌套控制器来声明$ scope的继承。在这种情况下,您可以使用$ rootscope广播或收听事件:

//ctrl1    
$rootScope.$broadcast("somethingClicked",obj);

//ctrl2

$rootScope.$on("somethingClicked",function(a,b){
    console.log(a)
    console.log(b);
});

在Stack Overflow上查看这个简单的demo以及较旧的question

<强> EDITED 根据您的示例代码,我在使用$rootscope进行通信时没有任何问题。

状态声明使用抽象父控制器和映射到视图中的获取子控制器:

$stateProvider
        .state('test', {

          url: '/test',
          controller: 'pctrl',
          views: {
            'main': {
              template: '<div ng-controller="pctrl">{{test}}</div>' +
                '<div ui-view="childview"></div>'
            }
          }
        })
        .state('test.child', {
          url: '/test/child',
          controller: 'cctrl',
          views: {
            'childview': {
              template: '<div ng-controller="cctrl" />'
            }
          }
        });

这是 full working demo

答案 1 :(得分:0)

找到答案 - 我错误配置了我的路由文件,并为我正在加载的页面指定了错误的控制器。这就是为什么我的活动听众都没有注册的原因!