Автозаполнение Google Адресов не отображается

Я работал над этим часами, пытаясь понять, почему якобы простое автозаполнение не показывалось.

Оказывается, в моем коде элемент ввода устанавливается вautocompete="off"и стиль на пак-контейнереdisplay: none.

Я могу изменить эти значения в DevTools, и он отлично работает, но я не могу понять, как или почему они устанавливаются на эти значения.

Мое автозаполнение настроено в угловой директиве, как эта, где loadGmaps получает API Google.

  template: '<input id="google_places_ac" name="google_places_ac" type="text" class="input-block-level"/>',
        link: function($scope, elm, attrs){
 loadGmaps().then(function(){

                var autocomplete = new google.maps.places.Autocomplete($("#google_places_ac")[0], {});
                console.log(autocomplete);
                google.maps.event.addListener(autocomplete, 'place_changed', function() {
                    var place = autocomplete.getPlace();
                    $scope.position = {
                                        lat: place.geometry.location.lat(),
                                        lon:  place.geometry.location.lng()
                                    };
                    $scope.$apply();
                });
            });

---------------------Обновить---------------------------- ------------------

Надеюсь, никто больше не сбивается с путиautocomplete="off" немного вводит в заблуждение. Даже сautocomplete="off"автозаполнение все еще работает, так что это не проблема. Я переписываю CSS.pac-container элемент, который содержит результаты с

.pac-container {  //this is a fix for google autocomplete not showing up
                z-index: 10000 !important;
                display: block !important;
            }

Проблема заключается в том, что после выбора элемента из автозаполнения автозаполнение остается видимым, я уверен, что есть лучший способ использовать автозаполнение.

Ответы на вопрос(3)

Ваш ответ на вопрос