ngx-google-places-autocomplete icon indicating copy to clipboard operation
ngx-google-places-autocomplete copied to clipboard

Is there any way we can pick the first suggestion if no suggestion is picked by the user?

Open tanveer21 opened this issue 4 years ago • 1 comments

Any onBlur event which could do the required?

  • OnAddressChanges helps us to get the selected address details

  • Similarly, any onBlur event that would give access to all the suggestions on the basis of user input

tanveer21 avatar Nov 04 '20 05:11 tanveer21

@tanveer21 This is easy enough to do.. follow these steps

  • Add (keyup)="onKey($event) to your autocomplete input controller
<input
    ngx-google-places-autocomplete
    [options]='options'
    placeholder="Enter a location"
    autocomplete="off"
    (keyup)="onKey($event)"
    (onAddressChange)="handleAddressChange($event)"/>

The method should be something like that

public onKey(a: any) {
    let autocomplete_results = document.querySelector('.pac-container');
    let pac_items = autocomplete_results.querySelectorAll('.pac-item');
    if (pac_items.length > 0) {
      for (let i = 0; i < pac_items.length; i++) {
        console.log(pac_items[i].textContent);
      }
    }
  }

all the consoled items are the suggestions that you're getting.. just pick pac_items[0].textContent to get the first suggestion

Hope this helps, Riad

jaradehr1 avatar Nov 15 '20 23:11 jaradehr1