In angular route provider setting page title based on url

Question

How do I access the url in the setTitle anonymous function?

I have something like below in my route setup for Angular. Most routes point to the same controller, there are some differences in the controller but essentially the problem is duplicated routes. So I want to move to something that only has one entry in the table, but need to change the SetWindowTitle to set the title based on the url paramter. The code I have displayed does not work as the producttype var is undefined.

Current code:

.config(['$routeProvider',
    function ($routeProvider) {

    $routeProvider
        .when('/mypage/round', {
            templateUrl: 'product',
            controller: 'productController',
            resolve: {
                setTitle: function() { 
                    SetWindowTitle('product round')
                }
            },
        })
        .when('/mypage/square', {
            templateUrl: 'product',
            controller: 'productController',
            resolve: {
                setTitle: function() { 
                    SetWindowTitle('product square')
                }
            },
        })
   // etc...

Want something like:

    $routeProvider
        .when('/mypage/:producttype', {
            templateUrl: 'product',
            controller: 'productController',
            resolve: {
                setTitle: function() { 
                    SetWindowTitle('product ' + producttype)
                }
            },
        })

Prashant K · Accepted Answer · 2016-11-22 02:11:07Z

1

We can access the route URL in the resolve function by injecting '$route'. Here is what you need to do :

$routeProvider
    .when('/mypage/:producttype', {
        templateUrl: 'product',
        controller: 'productController',
        resolve: {
            setTitle: function($route) { 
                SetWindowTitle('product ' + $route.current.params.producttype)
            }
        },
    })

$route.current - Consist of all the current route URL details, like the controller, original path, path, template url etc.

answered Nov 22, 2016 at 2:11

Prashant K

9199 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

miltonb Over a year ago

Thanks - works great, note that it broke because of the minification when I tried it. Hope you dont mind, I updated your answer to cover that.

Prashant K Over a year ago

your welcome, yeah you need to put it in array which should be the practice actually but had to just give you the answer by changing your code snippet, so skipped it.

Collectives™ on Stack Overflow

In angular route provider setting page title based on url

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related