将Google Places api加载到组件库无index.html文件

问题描述

当前在我的代码中“ places”未定义。 该文件位于其他应用程序使用的组件库中，因此它本身无法访问Index.html文件。

.ts代码

 import { MapsAPILoader } from '@agm/core';
 import { Component,ElementRef,Inject,ngzone,OnInit,ViewChild } from '@angular/core';
 import { FormControl } from '@angular/forms';
 import {} from 'googlemaps';
 @Component({
   selector: 'lib-google-search',templateUrl: './google-search.component.html',styleUrls: ['./google-search.component.scss']
 })
 export class GoogleSearchComponent implements OnInit {
     zoom: number = 0;
     searchElementRef: ElementRef;
     searchControl:FormControl;
     latLong:any;
     google:any;
     @ViewChild('search',{static:false}) Component
      constructor(
      private mapsAPILoader: MapsAPILoader,private ngzone: ngzone,private elementRef:ElementRef
    ) { }  
    ngOnInit() {
    this.searchControl = new FormControl();
    this.mapsAPILoader.load().then(() => {
     const autoComplete = new google.maps.places.Autocomplete(this.searchElementRef.nativeElement,{
     types: [],componentRestrictions: {'country': 'USA'}
    });
    autoComplete.addListener('place_changed',() => {
    this.ngzone.run(() => {
      const place: google.maps.places.PlaceResult = autoComplete.getPlace();
      if (place.geometry === undefined || place.geometry === null){
        return;
      }
      const latlong = {
        latitude: place.geometry.location.lat,longitude : place.geometry.location.lng

      }
      this.latLong.push(latlong);
      this.searchControl.reset();
  });
 })
});
}  
}

我需要不使用index.html文件加载场所库的某种方式

非常感谢您的帮助！

解决方法

我最终使用Angular Google Maps（AGM）加载了该库，并且运行良好。

import { AgmCoreModule } from '@agm/core';
AgmCoreModule.forRoot({
  libraries:['places'],apiKey: 'your googleapi key'
}),

您可以在这里获得此库。 https://angular-maps.com/