google object undefined с помощью угловых2-google-maps и google places searchbar

Question

В настоящее время я работаю над угловым2-приложением, которое использует Карты Google.

У меня есть встроенный и экземпляр Google Maps в приложение, используя отличный модуль угловых2-google-карт sebm.

Проблема, которую я сейчас имею, заключается в том, что я хотел бы использовать панель поиска автозаполнения google.

я импортировал модуль в мой модуль карты, как это:

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { AgmCoreModule } from 'angular2-google-maps/core'; 
import { MapComponent } from './map.component'; 

@NgModule({ 
    imports: [ 
    CommonModule, 
    AgmCoreModule.forRoot({ 
     apiKey: '************************', 
     libraries: ['places'] 
    }) 
    ], 
    declarations: [MapComponent] 
}) 
export class MapModule { } 

Который работает отлично повторно на самой карте. Однако вся документация я могу найти (например, это thread) говорит, что объект в «Google» должно существовать во всем мире в настоящее время, и что я должен быть в состоянии получить ее, просто объявив его в моем компоненте т.е.

declare var google: any; 

Когда я пытаюсь это сделать, а затем попытаюсь использовать объект google, например

console.log(google); 

... это дает мне ошибку, что Google не определен.

Answer 1

Вам необходимо ввести MapsAPILoader в свой класс, а затем вызвать метод загрузки.

До завершения загрузчика объект google не будет доступен.

Пример:

конструктор (частный _mapsAPILoader: MapsAPILoader) {}

ngAfterViewInit() { 
    this._mapsAPILoader.load().then(() => { 
    // Place your code in here... 
    }); 
} 

Этот ответ был из amiller29au право вдовца на пожизненное владение имуществом умершей жены с помощью GitHub here - реплицированного для более широкого доступа.

Answer 2

Угловые пробеги после загрузки index.html. Если вы поместите что-то в ngOnInit (лучше, вероятно, будет ngAfterViewInit), то document.ready должен уже уволить.

Единственный способ это может пойти не так, если у вас есть тег async или defer на свой тег скрипта, который получает библиотеку google.

Еще лучше было бы установить карты google с помощью node и установить любой загрузчик, который вы используете для получения библиотеки Google при необходимости (с ключом googlemaps). Затем вы можете разместить import "googlemaps" в своем PlacesComponent, чтобы убедиться, что библиотека загружена

Answer 3

Вы можете использовать этот объект в обработчике событий ngAfterViewInit. Он запускается после загрузки представления.