I have a simple setup in my config()
$stateProvider
.state('app', {
'url': '/app',
'abstract': true,
'templateUrl': 'views/layout/index.html',
'controller': 'App'
})
.state('app.home', {
'url': '/home',
'views': {
'appContent': {
'templateUrl': 'views/home/index.html',
'controller': 'Home'
}
}
});
.state('app.asd', {
'url': '/asd/:idContact?',
'views': {
'appContent': {
'templateUrl': 'views/asd/index.html',
'controller': 'Asd'
}
}
});
$urlRouterProvider.otherwise('/app/home');
If i browse app/asd/7
everything works if i browse then app/asd
it redirects me
I am wondering how can i make idContact param not required ? I used the classic $routeProvider sintax for it :(
Try:
/asd/{idContact:/?.*}
As far as I know that is the workaround to make parameters optional in ui router. I'm not sure if there have been any recent built in implementations of this in ui router.
Just wanted to provide some example giving the answer to optional parameter issue. See that all in working example.
This Q&A does explain more details:
Here is a snippet of two states definition:
.state('view', {
url: '/view/:inboxId',
templateUrl: 'tpl.view.html',
controller: 'viewCtrl'
}).
state('view_root', {
url: '/view',
templateUrl: 'tpl.view.html',
controller: 'viewCtrl'
})
And here are some ways how to create links (href
or ui-sref
) to reach these states:
// href
<a href="#/view/1">/view/1</a> - id is passed<br />
<a href="#/view/"> /view/ </a> - is is missing - OPTIONAL like <br />
<a href="#/view"> /view </a> - url matching the view_root
// ui-sref
<a ui-sref="view({inboxId:2})"> - id is passed<br />
<a ui-sref="view"> - is is missing - OPTIONAL like
<a ui-sref="view({inboxId:null})"> - id is explicit NULL <br />
<a ui-sref="view_root()"> - url matching the view_root
That should show, that we do not have to pass some param, just must be sure that the proper url is called (the trailing /
)