Using Google Maps Javascript API I can’t get autocomplete to bind to the input field based on element id
. If I put the search bar in <ion-content>
it works fine, but in the ion-nav-title bar its like it can’t see the element ID.
In the controller:
var input = ( document.getElementById('searchCity') ) ;
var autocomplete = new google.maps.places.Autocomplete(input) ;
In my HTML:
<ion-nav-title>
<input type="text" id="searchCity" ng-model="$parent.searchInfo.searchCity" ng-change="$parent.disableTap('searchCity')">
</ion-nav-title>
The above returns an error with Google: InvalidValueError: not an instance of HTMLInput Element
If I move the above input
code to the ion-content
section, it all works fine.