typescript - Google Places-bibliotekswidget som använder JS API-loader i Angular

Jag försöker skapa ett adressinmatningsfält med hjälp av Google Places-biblioteket. Jag vill använda google-js-api-loader istället för en script-tagg, men jag verkar inte få det att fungera. Här är min kod hittills:

adress-autocomplete.component.html

<input
  id="autocomplete"
  type="text"
  pInputText
  [(ngModel)]="inputAddress"
  [style]="{ width: '15rem' }"
/>

adress-autocomplete.component.ts

import {} from "@angular/google-maps";
import { Loader } from "@googlemaps/js-api-loader";

@Component({
  selector: "app-address-autocomplete",
  templateUrl: "./address-autocomplete.component.html",
  styleUrls: ["./address-autocomplete.component.scss"],
})
export class AddressAutocompleteComponent implements OnInit {
  inputAddress = "London";
  autocomplete!: google.maps.places.Autocomplete;
  constructor() {}

  ngOnInit() {
    const loader = new Loader({
      apiKey: "API_KEY", // 
      version: "weekly",
      libraries: ["places"],
    });
    loader.load().then((google) => {
      this.autocomplete = new google.maps.places.Autocomplete(
        document.getElementById("autocomplete") as HTMLInputElement
      );
      console.log(this.autocomplete);
//Gs {setTypes: function, setComponentRestrictions: function, getPlace: function, getBounds: function, …}
      console.log(this.autocomplete.getPlace());
//undefined
    });
  }
}

Jag satte det initiala värdet på inmatningsfältet, men det returnerar fortfarande undefined även om autocomplete-variabeln innehåller Autocomplete-objektet. Jag missar troligen något uppenbart. Tack på förhand. Redigering: stavning

Svar #1

Jag letade efter ett bibliotek för att hantera adressautokomplettering, jag har använt din kod och ändrat den lite, försök att hantera det på detta sätt:

loader.load().then((google) => {
        const autocomplete = new google.maps.places.Autocomplete(
            autoCompleteNativeElementRef
        );
        google.maps.event.addListener(autocomplete, 'place_changed', () =>  {
                const place = autocomplete.getPlace();
                console.log(place);
        });
    });