How can I pass an id from one controller to another in Angular? I have a select menu that allows for selecting a tournament, and upon selection, I want to retrieve the tournament’s _id value in a different controller to query data. Being new to Angular, any guidance would be highly appreciated. Thank you!
Select Menu
<select class="form-control" ng-model="vm.selectedTournamentId" ng-change="vm.showTournament()" >
<option value="">Select a tournament</option>
<option ng-repeat="tournament in vm.tournaments" value="{{ tournament._id }}">{{ tournament.name }}</option>
</select>
app.js
.controller('NavigationController', NavigationController);
NavigationController.$inject = ['TournamentService', '$q', '$location', '$scope', '$filter', '$state'];
function NavigationController(TournamentService, $q, $location, $scope, $filter, $state) {
var vm = this;
vm.tournaments = TournamentService.query();
vm.showTournament = function() {
var tournament = TournamentService.query({id: vm.selectedTournamentId}, function() {
vm.selectedTournament = tournament[0]
$state.go('dashboard.tournament')
});
}
}
dashboard.js
angular.module('Dashboard',[]).controller('DashboardController',
DashboardController).factory('TournamentService', TournamentService).factory('UserService', UserService).factory('TeamService', TeamService)
DashboardController.$inject = ['$scope','TournamentService','TeamService','UserService','$q'];
function DashboardController($scope, TournamentService, TeamService, UserService, $q) {
var vm = this;
var tournaments = TournamentService.query();
var users = UserService.query();
var teams = TeamService.query()
$q.all([tournaments, users, teams]).then(function(results) {
vm.users = users;
vm.availablePlayers = users;
vm.tournaments = tournaments;
vm.teams = teams;
})
}
TournamentService.$inject = ['$resource'];
function TournamentService($resource) {
return $resource('/api/tournaments/:id',{cache: true},{tournament: '@tournament'});
}
UserService.$inject = ['$resource'];
function UserService($resource) {
return $resource('/api/users/:id', {cache: true},{user: '@user'})
}
TeamService.$inject = ['$resource'];
function TeamService($resource) {
return $resource('/api/teams/:id',{cache: true}, {team: '@team'})
}
})();