I have a state configuration of the below sorts:
(function(angular) {
'use strict';
angular.module('myModule')
.config(function($stateProvider, 'root', 'place-locator') {
var placeLocatorConfig = {
url: '/place-locator/{param1}/{param2}?qp1&qp2',
parent: 'root',
params: {
param1: {
value: null,
squash: true
},
param2: {
value: null,
squash: true
}
},
views: {
main: {
templateUrl: 'app/placeLocator/placeLocator.tpl.html',
controller: 'PlaceLocatorController as vm',
bindings: {
places: '='
}
}
}
};
$stateProvider
.state('place-locator', placeLocatorConfig);
});
})(angular);
Whenever I try to $state.transitionTo a child state, it all works fine as long as the QueryParams in the URLs are the ones that are registered in the StateConfig(i.e. qp1 or qp2).
But as soon as the URL contains a queryParam that is not registered in the configuration(say qp3), it gets stripped away on $state.transitionTo
Now, I'm not really sure what the names of these QueryParams are going to be. But I still need them in the URL after $state.transitionTo.
How do I achieve this without registering them as a part of the StateConfig?
I had a look at the below questions:
Adding query string to UI router route
Angular UI Router - allow ANY query string parameter
Query string parameter in ui-router urls?
But none of them resembles my case.
I've also tried the solution in this case:
AngularJS UI-Router navigate without removing query params
But that doesn't help. The non-registered QueryParams are still getting stripped away.