最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - $scope.$on not triggering after $rootScope.$broadcast in angular service - Stack Overflow

programmeradmin0浏览0评论

This may be the repeated question but the workaround I found for this issue is not working in my case thats why I am posting the question.

I've following service:

appRoot.service('MyService', function($rootScope) {
    var Messenger = {
        Temp: "",
        TempId:"",
        tempMethod: function(Id) {
            TempId = Id;
            $rootScope.$broadcast('FirstCtrlMethod');
        }
    };
    return Messenger ;
});

In second controller:

appRoot.controller('SecondCtrl', function ($scope, $location, MyResource, NotificationService, MyService) {
 $scope.invokeFirstCtrl= function() {
        var Id = '2';
        MyService.tempMethod(Id);
});

In first controller:

appRoot.controller('FirstCtrl', function ($scope, $compile, $filter, $modal, $sce, $location, NotificationService, MyService) {
$scope.$on('FirstCtrlMethod', function () {        
        alert('I am from frist controller');
    });
});

Problem: The line "$rootScope.$broadcast('FirstCtrlMethod');" is executing as expected but it is not causing to fire event "$scope.$on('FirstCtrlMethod', function () {.." in the first controller. I've used the differenct services in many places in my app in the same way and they are workig fine, I am not understanding why it is not working here.

This may be the repeated question but the workaround I found for this issue is not working in my case thats why I am posting the question.

I've following service:

appRoot.service('MyService', function($rootScope) {
    var Messenger = {
        Temp: "",
        TempId:"",
        tempMethod: function(Id) {
            TempId = Id;
            $rootScope.$broadcast('FirstCtrlMethod');
        }
    };
    return Messenger ;
});

In second controller:

appRoot.controller('SecondCtrl', function ($scope, $location, MyResource, NotificationService, MyService) {
 $scope.invokeFirstCtrl= function() {
        var Id = '2';
        MyService.tempMethod(Id);
});

In first controller:

appRoot.controller('FirstCtrl', function ($scope, $compile, $filter, $modal, $sce, $location, NotificationService, MyService) {
$scope.$on('FirstCtrlMethod', function () {        
        alert('I am from frist controller');
    });
});

Problem: The line "$rootScope.$broadcast('FirstCtrlMethod');" is executing as expected but it is not causing to fire event "$scope.$on('FirstCtrlMethod', function () {.." in the first controller. I've used the differenct services in many places in my app in the same way and they are workig fine, I am not understanding why it is not working here.

Share Improve this question asked Nov 4, 2014 at 5:03 Saurabh PalatkarSaurabh Palatkar 3,38412 gold badges52 silver badges112 bronze badges 4
  • 1 are both controller instantiated when you are testing this?? – harishr Commented Nov 4, 2014 at 5:59
  • Have you tried $emit instead of $broadcast? or just $rootScope.$on – Dylan Commented Nov 4, 2014 at 6:00
  • Yah I've tried both .$emit and $rootScope.$on but still its not working – Saurabh Palatkar Commented Nov 4, 2014 at 6:08
  • As pointed by @harish I was not initiating the first controller. Thats preventing the propogation of the event. Solved my issue. – Saurabh Palatkar Commented Nov 4, 2014 at 6:44
Add a comment  | 

2 Answers 2

Reset to default 14

putting comment as an answer...

I guess the other controller which is supposed to receive the event is not yet instatiated when you are $broadcasting the event.

Please try instantiating the other controller

Please see below working example

var app = angular.module('app', []);

app.service('MyService', function($rootScope) {
  var Messenger = {
    Temp: "",
    TempId: "",
    tempMethod: function(Id) {
      TempId = Id;
      $rootScope.$broadcast('FirstCtrlMethod');
    }
  };
  return Messenger;
});

app.controller('homeCtrl', function($scope, MyService) {

  $scope.invokeFirstCtrl = function() {
    var Id = '2';
    MyService.tempMethod(Id);

  };
});

app.controller('FirstCtrl', function($scope) {

  $scope.$on('FirstCtrlMethod', function() {
    alert('I am from frist controller');
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app">
  <div ng-controller="homeCtrl">

    <button ng-click="invokeFirstCtrl()">Invoke</button>
  </div>

  <div ng-controller="FirstCtrl">


  </div>
</div>

发布评论

评论列表(0)

  1. 暂无评论