Angularjs ui-router add parent url parameter to current state

Question

This is my app state

  .state('app', {
      url: "/?:site_id",
      templateUrl: "/controls/angular/templates/partial/app.html",
      abstract: true
  })
  .state('app.popup', {
    url: "popup",
    templateUrl: "/controls/angular/templates/popup.html",
    controller: 'PopupController'
  })

The app root (that config as abstract) has parameter (site_id) that I can use in all other pages in the application.

I have drop-down list that can change the site. How can I add the site url parameter to current page with all other parameters that exist

Just change the root site_id parameter.

     var oSelect =  $('#site_select_tag').select2();
        oSelect.on("change", function (e) {
       var curr_site_id = e.val;                                
       $state.go to => ?????????                               
       //scope.site_id = e.val;
       scope.onChange()(e.val);
});

I don't know what the options to add single parameter to current state (with parameters), I add the "state go" just for example. — 24sharon
– 24sharon, Commented Feb 18, 2016 at 10:11

24sharon · Accepted Answer · 2016-02-18 10:47:42Z

1

Thanks

The solution is simple

$state.go('.', {site_id: e.val})

Keep all other parameters and set the new parameter

answered Feb 18, 2016 at 10:47

24sharon

1,97510 gold badges45 silver badges70 bronze badges

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

1 Comment

alfredopacino Over a year ago

quick and easy way. It should be the answer.

iH8 · Accepted Answer · 2016-02-18 10:33:15Z

0

You can pass options to the go method of $state:

$state.go(to [, toParams] [, options])

https://github.com/angular-ui/ui-router/wiki/Quick-Reference#stategoto--toparams--options

$state.go('myState', {'myParam': myValue});

And you can set parameters on ui-sref:

ui-sref='stateName({param: value, param: value})'

https://github.com/angular-ui/ui-router/wiki/Quick-Reference#ui-sref

<a ui-sref="myState({'myParam': myValue})">myLink</a>

You can access the current state as $state.current.name and the current parameters as $state.params so what you can do is this:

var params = $state.params;
params.id = 123; // Set new ID
$state.go($state.current.name, params);

edited Feb 18, 2016 at 10:33

answered Feb 18, 2016 at 10:20

iH8

28.8k4 gold badges72 silver badges83 bronze badges

2 Comments

24sharon Over a year ago

But like I said I don't know what the state is and what the other parameters are.

iH8 Over a year ago

Ok, edited my answer. Hope i understood you correctly this time.

Shmee007 · Accepted Answer · 2016-02-18 10:35:41Z

If I understand you correctly your trying to manipulate the state data after it is set up in the $stateProvider. If so you should set up your own state provider like Mean.io do

// $meanStateProvider, provider to wire up $viewPathProvider to $stateProvider
angular.module('mean.system').provider('$meanState', ['$stateProvider', '$viewPathProvider', function($stateProvider,viewPathProvider){
    function MeanStateProvider() {
        this.state = function(stateName, data) {
          if (data.templateUrl) {
            data.templateUrl = $viewPathProvider.path(data.templateUrl);
          }        
          $stateProvider.state(stateName, data);        
          return this;
        };    

        this.$get = function() {
          return this;
        };
    }
    return new MeanStateProvider();
    }]);

Collectives™ on Stack Overflow

Angularjs ui-router add parent url parameter to current state

3 Answers 3

1 Comment

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related