I'm having an issue with AngularJS and URLS. When I press the back/forward buttons in the browser I want my models to update accordingly. As you can see from this page: http://www.networkwestmidlands.com/whats-on/#params?when=Today&what=Events&where=birmingham
It pulls the variables from the url(a getter function that I set as my default value for x model if available) and sets them to the model for each search filter. If you start updating the filters the URL will also update(this calls a function on ng-change), and refreshing or sharing the url will load the page with all the models predefined from the url.
The trouble i'm having is that the view/controller doesn't update/refresh when pressing the back/forward buttons.
An example of how I define my model on page load in my controller:
vm.type = getFromURL('what=') || 'Events';
function getFromURL(filterName){
var url = $location.url();
// if there is already a hash in the url
if(url && url.indexOf('params?') >= 0){
// If the search param already exists
if(url.indexOf(filterName) >= 0){
// Split url at already existing search param
var searchParams = url.split(filterName)[1];
// if there is still an '&' in the url do something
if(searchParams.indexOf('&') >= 0){
// split at the '&' and get rid of anything after it(other search params)
var singledParam = searchParams.split('&')[0];
return singledParam;
}else{
return searchParams;
}
// If the suggested search param doesn't exist
}
}
}
I ended up using: $location.url(url).replace();
which worked as required.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.