Change hash without reloading controller in AngularJS

Question

I'm working on a currency converter, and I have url like #/currency/50/USD/to/EUR, where 50, USD and EUR are parameters. Now I have a switch function which swaps the currencies and keep the value to convert, I'd like to change the URL as well to something like #/currency/50/EUR/to/USD without reloading the controller, just change the hash. I have an idea on how to do with pure js, but is there any solution in angular way?

You can also look at ui-router module which can replace the standard routing with state base routing and can support your scenario.http://angular-ui.github.io/ui-router/sample/#/ — Chandermani, Aug 29 '13 at 09:08

score 13 · Accepted Answer · edited May 23 '17 at 12:23

13

Check this answer out. It sounds just like what you need.

Basically, you seem to have two choices:

Listen for $locationChangeSuccess event.
In your $routeProvider definition, while defining the routes and the corresponding templated to load, specify the option reloadOnSearch = false.

edited May 23 '17 at 12:23

Community

1
1

answered Aug 29 '13 at 08:56

callmekatootie

10,989
15
69
104

Solution one works, but I had to do some tweaks to load other controller when needed. – Jonathan de M. Aug 29 '13 at 09:46

score 7 · Answer 2 · answered Aug 29 '13 at 09:51

7

Ok following callmekatootie solution here's my result, I had to add a condition to be able to go out of my controller when required

controller('CurrencyConvertCtrl', function ($scope, $route){
    var lastRoute = $route.current;
    $scope.$on('$locationChangeSuccess', function(event) {
        if($route.current.$$route.controller === 'CurrencyConvertCtrl'){ 
        // Will not load only if my view use the same controller
            $route.current = lastRoute;
        }
    });
}

answered Aug 29 '13 at 09:51

Jonathan de M.

9,721
8
47
72

breaks the back button – parliament Apr 10 '16 at 00:10
I was using something similar which was not changing the route but was reloading the controller. Adding `event.preventDefault()` fixed this for me. – doublesharp Apr 21 '17 at 16:49

Change hash without reloading controller in AngularJS

2 Answers2