Change query param in url using UI-router

Question

Using ui-router how can I accomplish the following URL change? For example, when a user goes to "/page?hello=True" I want the url to change to "/page?status=hello".

$stateProvider.state('page', {
   url: '/page/:id?status',
   controller: 'MyCtrl as myCtrl',
   templateProvider: function($templateCache) {
     return $templateCache.get('templates/route.html');
   }
 });

can use stateChangeStart event in ui-router to change the params of the url. — reptilicus
– reptilicus, Commented Jan 26, 2016 at 22:43

reptilicus · Accepted Answer · 2016-01-26 22:50:19Z

1

You can use the stateChangeStart event in the app.run method to listen for state changes into that route, and change anything you want on the params. Something like this, might need to play with toState and toParams to get it right for you...

.run(['$state', '$rootScope', function($state, $rootScope) {
    $rootScope.$on('$stateChangeStart', function(e, toState, toParams, fromState, fromParams) {

        if (toState.name === 'invitation') {
            //change toParams to whatever you want 
        }
    });
});

answered Jan 26, 2016 at 22:50

reptilicus

10.4k6 gold badges59 silver badges80 bronze badges

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

Collectives™ on Stack Overflow

Change query param in url using UI-router

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related