How to avoid memory leaks with Javascript google.maps.places. Autocomplete in Angular ng-view

I am having problems with google.maps.places.Autocomplete

and single page application. Long story short, I have an Angular directive form

with a field input

. The field input

has an autocomplete feature, so when you click and enter an address, the corresponding addresses are displayed. Its a single page application, so that the user navigates to the page where he loads the corresponding one ng-view

. When the user navigates to another page and other content is loaded into ng-view

, the memory is not cleared. Using the profile and snapshots in Google Chrome, I can clearly see that there is garbage and the form element is detached (marked in red). This is related to the field input

where autocomplete

. I narrowed it down to the line where the new one is announcedgoogle.maps.places.Autocomplete

... If I remove the call to autocomplete memory, then it clears up as it should, otherwise the entire form the input aaa

is in remains in memory. I also clear all variables on $ destroy, so it might be garbage collection, but nothing seems to work. Is there any solution for this and any way to use Autocomplete on dynamically loaded ng views without leaking memory?

link: function (scope, elem, attrs, ctrl) {
                var autocomplete;
var aaa=document.getElementById('address');

                function initializeGoogleMaps() {
                    autocomplete = new google.maps.places.Autocomplete(
                        (aaa), {
                            types: ['geocode']
                        });
                    scope.$on('$destroy', function () {
                        $(".pac-container").remove();
                        autocomplete=null;
                    });



    }

        initializeGoogleMaps();
// some other code