0

template :

<div  *ngFor="let location of Item.Locations; let i = index;">
  <input #searchBox  type="text" > 
</div>

code :

@ViewChild('searchBox') geocodeTest : ElementRef;  

searchGoogleLocation(){
  let input: any = this.geocodeTest.nativeElement;
  console.log(this.geocodeTest);
  let searchBox = new google.maps.places.Autocomplete(input);
  console.log(searchBox);
  searchBox.addListener("place_changed", () => {
    this._ngZone.run(() => {
      console.log('listening');
      let place = searchBox.getPlace();
      if (place) {
        let loc = {
          name : place.formatted_address,
          latLng : place.geometry.location.toJSON
        }
       return ;
      }
    })
  });
}   

searchBox input fields created dynamically. So I want to access all these input fields and bind the Google auto-complete place API to tht input fields. and get the result which returns from the API. this code is working fine on one input field. but when there is more it doesn't working.How can I access these html elements dynamically. (sorry for my bad English) Thank you.

Community
  • 1
  • 1
Sachithra Wishwamal
  • 117
  • 1
  • 2
  • 10

0 Answers0