Routing with parameters
examples/angular/routing_params.html
<script src="angular.min.js"></script> <script src="angular-route.min.js"></script> <script src="routing_params.js"></script> <div ng-app="DemoApp" ng-controller="DemoController"> <a href="#/">home</a> <a href="#/item/42">42</a> <a href="#/person/Foo/Bar">person</a> <div ng-view></div> </div>
examples/angular/routing_params.js
angular.module("DemoApp", ['ngRoute']) .controller("DemoController", ['$scope', function($scope) { console.log('Demo controller'); $scope.title = "Demo"; }]); angular.module("DemoApp") .controller("HomeController", ['$scope', function($scope) { console.log('Home controller'); $scope.title = "Home"; }]); angular.module("DemoApp") .controller("FirstController", ['$scope', '$routeParams', function($scope, $routeParams) { console.log('First controller'); console.log($routeParams); $scope.params = $routeParams; $scope.title = "First"; }]); angular.module("DemoApp") .controller("SecondController", ['$scope', '$routeParams', function($scope, $routeParams) { console.log('Second controller'); console.log($routeParams); $scope.params = $routeParams; $scope.title = "Second"; }]); angular.module("DemoApp") .config(['$routeProvider', function($routeProvider) { $routeProvider. when('/', { template: 'Home page - {{title}}', controller: 'HomeController' }). when('/item/:id', { template: 'First page params: {{params}}', controller: 'FirstController' }). when('/person/:fname/:lname', { template: 'Second page params: {{params}}', controller: 'SecondController' }). otherwise({ redirectTo: '/' }); }]);