AngularJS ui router mandatory parameters

Question

Based on the documentation, angularjs ui-router url parameters are by default optional. So is there a way to create mandatory parameters? Like when the parameter is missing or null it will not proceed to the page?

Hope you can help me.

Thanks

Why not 'if (typeof param === 'undefined') and then redirect? — user3791775
– user3791775, Commented Jun 10, 2016 at 23:10
It's not on my view already. Also I can't do it on my controller, is there a way to do it while declaring the states? — Jed
– Jed, Commented Jun 10, 2016 at 23:15
Then I don't know. I think you should not load an init state with url parameters. Just redirect after the init in your init directive or controller — user3791775
– user3791775, Commented Jun 10, 2016 at 23:21

Gregg · Accepted Answer · 2016-06-13 11:39:11Z

4

Use UI Routers resolve to check if route params are missing.

//Example of a single route
.state('dashboard', {
  url: '/dashboard/:userId',
  templateUrl: 'dashboard.html',
  controller: 'DashboardController',
  resolve: function($stateParams, $location){

    //Check if url parameter is missing.
    if ($stateParams.userId === undefined) {
      //Do something such as navigating to a different page.
      $location.path('/somewhere/else');
    }
  }
})

edited Jun 13, 2016 at 11:39

answered Jun 11, 2016 at 0:54

Gregg

6577 silver badges19 bronze badges

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

4 Comments

Jed Over a year ago

It doesn't work when the scripts are minified. Do you have any idea?

Gregg Over a year ago

That is not good. Apologies. Try removing the [] wrapping the resolve function.

Jed Over a year ago

For future reference, instead of removing the [], I did it the way AngularJS wants it to be: resolve : ['$stateParams', '$location', function($stateParams, $location){ //body here }]

Chris T Over a year ago

resolve is an object with keys and values. It should be resolve: { somekey: function($stateParams, $location){ ... } }.

Alexander · Accepted Answer · 2017-03-25 17:55:33Z

2

Above answer prasents incorrect usage of resolve that will fail when code is minified even if annotated. Look at this issue I've spent a lot of time debugging this, because [email protected] won't warn you that resolve should be object.

resolve: { 
    somekey: function($stateParams, $location){

        //Check if url parameter is missing.
        if ($stateParams.userId === undefined) {
          //Do something such as navigating to a different page.
          $location.path('/somewhere/else');
    }
}

If you need minification, ngAnnotate

edited Mar 25, 2017 at 17:55

answered Mar 25, 2017 at 17:43

Alexander

811 silver badge6 bronze badges

1 Comment

sfs Over a year ago

You are missing an end bracket.

Collectives™ on Stack Overflow

AngularJS ui router mandatory parameters

2 Answers 2

4 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related