In AngularJS, how do I add a $watch on the URL hash?

angularjs, javascript

Solution

`$scope.$watch` accepts function as the first argument, so you can do this:

$scope.$watch(function () {
    return location.hash
}, function (value) {
    // do stuff
});

But I would recommend using events, such as `$routeChangeSuccess` for default router:

$scope.$on("$routeChangeSuccess", function () {})

or `$stateChangeSuccess` for ui-router

$scope.$on("$stateChangeSuccess", function () {})

Problem

Using Angular, how can I add a watch that is fired when the hash is updated, either by my application, or when the browser updates the URL from either the URL bar or the back/forward buttons?

Original source