How to change route inside the function "autocomplete.addListener()" ? AngularJs Google Maps API

Question

I want On selecting one suggestion the route to be changed to '/blood_test' but its not happening, only getting the console.log properly

but on putting the $location.path('/blood_test'); outside the function the route is changing

 $location.path('/blood_test');
autocomplete.addListener('place_changed', function() {
          console.log('yoyoyoyo');
          $location.path('/blood_test');
       });

 autocomplete.addListener('place_changed', function() {
          console.log('yoyoyoyo');
          $location.path('/blood_test');
       });

I expect the change of route to '/blood_test' but its staying in the same route.

Answer 1

place_changed event is triggered outside of the angular context, you have to replace

$location.path(url);

with

$scope.$apply(function() {
    $location.path(url);
});

Here is a demo