My SPA uses the new angular router. Everything is working well, but now I would like to pass a parameter to one of the components. There are multiple viewports in every routing, and in this case I can't grab the parameter passed to the router.
The routing
AppController.$routeConfig = [
{
path: '/',
redirectTo: '/home'
},
{
path: '/home',
components: {
'main': 'home',
'footer': 'footer'
},
as: 'home'
},
{
path: '/request',
components: {
'main': 'request',
'footer': 'footer'
},
as: 'request'
},
{
path: '/request/:id',
components: {
'main': 'request',
'footer': 'footer'
},
as: 'requestid'
},
{
path: '/allItems',
components: {
'main': 'allItems',
'footer': 'footer'
}, as: 'allItems'
}
];
The calling of the route
<a class="btn btn-warning" aria-haspopup="true" aria-expanded="false" ng-link="requestid({id: 1})">
the result url seems legit
https://<sitename>/index.aspx#/request/1
The controller cannot get the $routeParams.id.
angular.module('app.request')
.controller('requestController', ['$routeParams', '$scope', function ($routeParams, $scope) {
$scope.id = $routeParams.id;
}]);
What I've missed? Thanks in advance.