angularJs来自不同控制器的

时间:2015-06-25 05:16:06

标签: javascript angularjs onsen-ui

我们正在尝试使用phonegap onsen和angularJS开发应用程序。

我试图从不同的控制器调用一个函数。我已经看过很多关于如何执行此操作的文档,如this

但由于某种原因,它对我不起作用。到目前为止,这是我的代码。

module.run(function ($rootScope) {
    $rootScope.$on('some-event-here', function (event, data) {
        console.log('1');
        $rootScope.$emit('show-dialog-of-some-event', data);

        //I also tried
        //$rootScope.$broadcast('show-dialog-of-some-event', data); 
    });
});

module.controller('controller1', ['$scope', '$http',  function($scope, $http) {
    $scope.proceed = function() {
        console.log('0');
        $scope.$emit('some-event-here', {});
    }
}]);

module.controller('controller2', ['$scope', '$http',  function($scope, $http) {
    $scope.$on('show-dialog-of-some-event', function (event, data) {
        console.log('2');
        ons.createDialog('some-dialog.html').then(function(dialog) {                        
            //some code here
        });
    });
}]);

它在控制台'0'和'1'上显示,但它不显示'2'。

这可能是一个简单的问题,但我似乎无法找到我的代码的问题。

提前致谢。

4 个答案:

答案 0 :(得分:1)

我认为可能会发生的事情是你为事件声明一个事件处理程序' show-dialog-of-some-event'在controller2的本地范围内,即$ scope。您在$ rootScope中发出一个事件。发布的事件不会下降,因此事件“显示 - 某事件的对话”'没有"泡沫消失"从$ rootScope到$ scope。您可能希望为' show-dialog-of-some-event'定义事件处理程序。而是在根范围上,例如

    $rootScope.$on('show-dialog-of-some-event', function(e,d) {});

答案 1 :(得分:0)

如果您正在兄弟控制器之间进行通信以及从父控制器到子控制器之间进行通信,则必须使用$ scope。$ broadcast但是如果您想要从子级到父级进行通信,则必须使用$ scope。$ emit

答案 2 :(得分:0)

您的代码有两个问题:

1:$broadcast在范围层次结构中冒泡事件,$emit用于将它们冒泡到范围层次结构中,而不是使用它:

$rootScope.$broadcast('show-dialog-of-some-event', data);

有关详细信息,请参阅此答案:$rootScope.$broadcast vs. $scope.$emit

2:在您的控制器为此事件附加事件处理程序之前,将执行模块的run功能,因此在您在控制器中配置事件处理程序时,事件已经过了: / p>

再次,请参阅此答案AngularJS app.run() documentation?

所以答案的解决方案是:

  • $emit更改为$broadcast
  • 稍后将$broadcast电话移至生命周期,以便controller附加其听众

这是一个plunkr,我在生命周期的后期调用$broadcast(在这种情况下窗口加载时):

http://plnkr.co/edit/W7efiKqIlu4va4AcBTbG

答案 3 :(得分:0)

如果你不需要在rootscope上处理任何东西,你可以将$ rootScope注入控制器

module.controller('controller1', ['$scope', '$http', '$rootScope', function($scope, $http, $rootScope) {
    $scope.proceed = function() {
        console.log('0');
        $rootScope.$boardcast('some-event-here', {});
    }
}]);

module.controller('controller2', ['$scope', '$http',  function($scope, $http) {
    $scope.$on('some-event-here', function (event, data) {
        console.log('2');
    });
}]);

它不如使用服务那么干净,但如果不经常使用这种模式,你可以使用这种模式。