calling a method from controller when $locationChangeStart is broadcasted

Question

In my controller I changed the url with varying parameters depending on geolocation changes of my map. This is my setLocation method:

$scope.setLocation = function(lat,lng){
   $location.search('lat',lat);
   $location.search('lng',lng);
   $scope.$apply();
};    

I have another method that loads location data on the map. This is my getProjectsByCenter:

$scope.getProjectsByCenter = function(){
   var center = getProjectsByCenter();
   $scope.setLocation(center.lat(),center.lng());
};

Once the location starts changing the browser saves all these url changes in its history, but when I click on the back button I can't figure out how to call my controller's method. Back Button does change the $location and the following broadcast listener is called. In fact the following broadcast listener is called everytime I setLocation(), but in this case everything is working as it should.

app.run(['$rootScope', '$location',
function ($rootScope, $location) {

    //Client-side security. Server-side framework MUST add it's 
    //own security as well since client-based “security” is easily hacked
    $rootScope.$on('$locationChangeStart', function (event, next, current) {

        if( next !== current && (hasBackButtonBeenClicked() || scopeFunctionWasNotCalled()) ){
            // fetch project again.
            // $state.reload();
            // $rootScope.$apply(); <--- doesn't work
            console.log("location has changed...now find a way to call controller's $scope.getProjectsByCenter()...");
        }

    });

}]);

Any suggestions?

Answer 1

You can capture the change event in the following manner.

Add this controller in the destination page. The below method will capture the change event and you should be able to trigger the controller.

.controller('MyController', function() {
    $scope.$on('$routeChangeSuccess', function () {
        // Do your work
    });
})

Hope this is what you are looking for.