Aimad MAJDOU Aimad MAJDOU - 4 months ago 12
AngularJS Question

Using states with query string

I have a state as following :

.state('app.jobsList', {
url : '/jobs-list?typeContrat&ville&competence',
controller : 'OffresController',
templateUrl : 'views/tmpl/jobs.html'
})


to call this state I can use the following links :

app/jobs-list?typeContrat=
app/jobs-list?ville=
app/jobs-list


In my navbar I have an attribute to call
app/jobs-list
as following :

<a ui-sref="app.jobsList">Offres</a>


When I click on the link it works and it redirects me to that state.

And in my footer I have other attributes that calls these links :

app/jobs-list?typeContrat=
app/jobs-list?ville=


When I click on them they work and they redirects me to the
app.jobsList
state with the query string.

The problem is when I call one of these urls, and then I click on the attribute which has to redirect me to the
app/jobs-list
it doesn't work and it stays on the
app/jobs-list?typeContrat=
or
app/jobs-list?ville=
.

How can I solve this ?

Edit:



This is how I redirect in my footer :

<a href="" ng-click="search(null,ville.nomVille,null)">{{ville.nomVille}}</a></li>


And this is the search function:

$scope.search = function(typeContrat, ville, competence){
$state.go('app.jobsList',{typeContrat:typeContrat,ville:ville,competence:competence});
};

Answer

You're trying to reload the same state with new params. to force state reload use

<a ui-sref="app.jobsList({param1: 1, param2: 2})" data-ui-sref-opts="{reload: true}">Some text</a>

Or with $state:

$state.go('app.jobsList',{typeContrat:typeContrat,ville:ville,competence:competence}, {reload: true});