Emidomh Emidomh - 6 months ago 32
AngularJS Question

$state.go reload and update URL with dynamic paramaters

In a controller, I'm calling :

$state.go("myState", $scope.urlParams);


$scope.urlParams
can contains one or many params. (dynamic)

My
$stateProvider
config is like this :

url: '/myPage?param1&param2&param3&param4'


Now let's take an example to illustrate my problem :

I'm loading 'myPage' for the first time using :

$state.go("myState", $scope.urlParams);


with
$scope.urlParams = {'param1' : 111 , 'param2' : 222};


My URL looks like this
..../myPage?param1=111&param2=222


Now I'm already on 'myPage' but I'm using this time :

$state.go("myState", $scope.urlParams);


with
$scope.urlParams = {'param1' : 111};


My problem is there, my url still looks like this
..../myPage?param1=111&param2=222


But I want that, my URL looks like this :

..../myPage?param1=111


Any suggestion ?

Thanks !

Answer

On the second time, you should change your code to:

$state.go("myState", $scope.urlParams, {inherit: false});

$state.go calls $state.transitionTo internally but automatically sets options to { location: true, inherit: true, relative: $state.$current, notify: true }.

And the inherit property when set to true inherit URL parameters from current URL. That is why you are getting the previous parameters in the URL.

See the docs.