AngularJS optional route parameter

Question

I have an angularJS application where the route can be one of the below

www.website.com/blog/xyz
www.website.com/blog/xyz/title/other-params

In last url, title parameter is use for user readability sake, so it's not compulsory in the url. Hence I am using below angularJS code for my route.

$routeProvider
    .when('/blog', {
        templateUrl : url,
        controller : 'blogsHome'
    })
    .when('/blog/:blog_id', {
        templateUrl : url,
        controller : 'blogInfo'
    })
    .when('/blog/:blog_id/:url_params*', {
        templateUrl : url,
        controller : 'blogInfo'
    });

Now, in above code, I had to add middle when because angular expect :url_params and can not be empty. Is there any way I can omit middle when statement?

Answer 1

Adding * to you work with multiple levels of directories dynamically and adding ? to work with optional path. But when you want work with multiple levels but optional then can try like this ?:multipleOptionalParams*?

so try this one:

$routeProvider
    .when('/', {
        templateUrl : 'blog.html',
        controller : 'myCtrl'
    })
    .when('/blog/:blog_id/?:url_params*?', {
        templateUrl : 'details.html',
        controller : 'details'
    });

Can visit Plunker Demo

Answer 2

I would like to replace the 3rd when with the second one to change the sequence which when matches first.

Like so, the most complicated first:

$routeProvider
    .when('/blog', {
        templateUrl : url,
        controller : 'blogsHome'
    })
    .when('/blog/:blog_id/:url_params*', {
        templateUrl : url,
        controller : 'blogInfo'
    })
    .when('/blog/:blog_id', {
        templateUrl : url,
        controller : 'blogInfo'
    });