broadcast and emit does not work with ng-router?

Question

I want pass the value to one nerds controller to geek controller but unable to pass in ng-router.

<button type="Submit" ng-click="showUser()">Show Details</button>

.when('/geeks', {
    templateUrl: 'views/geek.html',
    controller: 'GeekController'    
})


.when('/nerds', {
    templateUrl: 'views/nerd.html',
    controller: 'NerdController'
})

In Nerds controller I have this function

  $scope.showUser=function(){
    $rootScope.$broadcast('btnName',{message:"msg"})
}

In geek controller I receiving the value on page load itself but i am not getting the value pls help me to find the solution

$rootScope.$on('btnName',function(event,args){
    $scope.msg=args.message;
    console.log("$scope.message nnnn",$scope.msg)
})

Answer 1

The NerdController and the GeekController are in two separate pages, only one of the controllers can be active at a time, since angular has only one page open in the tab. So what I suggest is, pass the variable as a parameter to the route, you can see this in the example below.

JSFiddle Demo

JS:

var routingExample = angular.module('Example.Routing', []);
routingExample.controller('NerdController', function ($scope, $location) {
    $scope.showUser = function(){
  console.log("show");
    $location.path('/geek/1');
  }
});
routingExample.controller('GeekController', function ($scope, $routeParams) {
    $scope.id = $routeParams.id;
});

routingExample.config(function ($routeProvider) {
    $routeProvider.
    when('/nerds', {
        templateUrl: 'home.html',
        controller: 'NerdController'
    }).
    when('/geek/:id', {
        templateUrl: 'blog.html',
        controller: 'GeekController'
    }).
    otherwise({
        redirectTo: '/nerds'
    });
});