My navigation menu has the following structure:
<div class="collapse navbar-collapse" id="admin-side-nav" ng-controller="AdminNav">
<ul class="nav nav-pills nav-stacked">
<li><a href="/admin/leaderboard/{{gameId}}">Leaderboard</a></li>
<li><a href="/admin/newsFeed/{{gameId}}">News Feed</a></li>
</ul>
</div>
I am using routes to load templates and make ajax requests to fetch data for the templates. The data returned includes an id which I want to bind to gameId, but I'm not sure how to do it.
Here is the JavaScript code for this functionality:
var console = angular.module('Console', ["ngRoute", "highcharts-ng"]);
console.config(function($routeProvider, $locationProvider){
$routeProvider.when('/admin/:gameid', {
templateUrl: 'admin/game.html',
controller: 'Game'
});
}).controller("Game", function($scope, $http){
$http.get("http://admin.gmserver.net/mypage").success(function(data){
$scope.games = data;
$scope.gameId = data._id;
});
}).controller("AdminNav", function($scope, $location){
$scope.isActive = function(viewLocation){
return viewLocation === $location.path();
};
});
I want to pass the $scope.gameId = data._id; line from the Game controller to the AdminNav controller. How can I achieve this data binding between the two controllers?