$rootScope.$broadcast is not working.

Yogesh33
Kilo Contributor
//HTML
<div class="col-md-2">
  		<ul class="nav nav-pills nav-stacked">
       	<li ng-class="{ active: isSet(1) }">
          	<a href ng-click="setTab(1)">Details</a>
       	</li>
       	<li ng-class="{ active: isSet(2) }">
          	<a href ng-click="setTab(2)">Profile</a>
       	</li>
       	<li ng-class="{ active: isSet(3) }">
          	<a href ng-click="setTab(3)">Messages</a>
       	</li>
     	</ul>
  	</div>
    <div class="col-md-8">
  		<div class="jumbotron">
       	<div ng-show="isSet(1)">
         	 <div ng-show="details()"></div>
        	</div>
			<div ng-show="isSet(2)">
          <h1>Profile page</h1>
          <p>Profile information</p>
     	</div>
        <div ng-show="isSet(3)">
          <h1>Messages</h1>
          <p> Some messages </p>
     	</div>
  	</div>

//Client Script
$scope.tab = 1;
    $scope.setTab = function(newTab){
      $scope.tab = newTab;
$rootScope.$broadscast(‘myDetails’, newTab); //This line of code broadcasts myDetails and passes it to first tab and display. But it is displaying it on click of the tab. I want it to be displayed on load of the page.
    };
    $scope.isSet = function(tabNum){
      return $scope.tab === tabNum;
    };

//to overcome above issue, I tried to do this:
$scope.details = function(dtl){		//I passed the function details() to the first tab content. Still it is not going to display anything.
$rootScope.$broadcast(‘myDetails’, dtl);
}

I am working tab sections. When I load the page, I want to display details on first tab. But it is been displayed onClick of the first Tab, Details.

2 REPLIES 2

Ankush Jangle1
Kilo Guru

Hi,

 

try to use $scope instead of $rootScope

and in function also pass function($scope){

}

 

Please Mark it Helpful/Correct if it helps you

 

 

DrewW
Mega Sage
Mega Sage

As Anksuh mentioned make sure you add $rootScope or the $scope to the parms of the client script at the top.  Also check your browser console for any script errors.