Угловое 2 (радиально-кли): Uncaught ReferenceError: Google не определен

я боролся в течение нескольких часов, пытаясь сделать работу GoogleMapsPlaceResult в моем Угловое 2 проекта, который использует Angular-cli.Угловое 2 (радиально-кли): Uncaught ReferenceError: Google не определен

Мне пришлось установить googlemaps с помощью @types и добавить его под атрибутом "types" моего конфигурационного файла tsconfig.json.

{ 
    ... 
    "types": [ 
     "google-maps" 
    ] 
    } 
}

И мне удастся использовать google.maps.places.PlaceResult в моем Угловое 2 компонента, просто импортировать его!

import { ActivatedRoute, Params } from "@angular/router"; 
import { MapsAPILoader } from "angular2-google-maps/core"; 

import PlaceResult = google.maps.places.PlaceResult; 
import GeocoderRequest = google.maps.GeocoderRequest; 
...

Несколько часов спустя, я должен был работать с google.maps.Marker, который находится в том же файле определения как PlaceResult и GeocoderRequest. Так что я просто импортировать его, как показано ниже:

[Line 12] import PlaceResult = google.maps.places.PlaceResult; 
[Line 13] import GeocoderRequest = google.maps.GeocoderRequest; 
[Line 14] import Marker = google.maps.Marker; 
[Line 15] import LatLng = google.maps.LatLng; 
...

Но у меня была неожиданная ошибка во время выполнения говоря

Uncaught ReferenceError: google is not defined search.component.ts:14 
at Object.444 (search.component.ts:14) 
at __webpack_require__ (bootstrap 26c2b97…:52) 
at Object.727 (app.config.ts:11) 
at __webpack_require__ (bootstrap 26c2b97…:52) 
at Object.602 (src async:7) 
at __webpack_require__ (bootstrap 26c2b97…:52) 
at Object.1258 (.*$:7) 
at __webpack_require__ (bootstrap 26c2b97…:52) 
at webpackJsonpCallback (bootstrap 26c2b97…:23) 
at main.bundle.js:1

Пожалуйста, обратите внимание, что WebPack выдает эту ошибку в линии 14 моего компонента. Это означает, что (и исправьте меня, если я ошибаюсь) предыдущие строки (которые используют один и тот же «google») работали хорошо.

Am'I отсутствует что-то?

Я использую:

Угловое: 2,4
радиально-CLI: 1.0.0-beta.24
машинописный: 2.0.10
angular2-google-maps: 0.17.0

источник

2017-02-20 Radouane ROUFID

я решить мою проблему, имеющую следующий конфигурации:

1- package.json

"dependencies": { 
    ... 
    "googlemaps": "^1.12.0", 
    ... 
    }

2- tsconfig.json

"types": [ 
     ... 
     "googlemaps" 
    ]

3- И добавьте скрипт google api в мой index.html

<head> 
    ... 
</head> 
<body> 
    <app-root>Loading...</app-root> 

    <script src="https://maps.googleapis.com/maps/api/js?key=KEY&libraries=places&language=fr" async defer></script> 
</body> 
</html>

4- В компонентах, использовать его, как показано ниже

declare var google: any; 

@Component({ 
    ... 
}) 
export class SearchComponent implements OnInit, AfterViewInit { 

    // Google Maps 
    bounds: google.maps.LatLngBounds; 
    markers: google.maps.Marker[]; 
    infoWindow: google.maps.InfoWindow; 

}

источник

2017-06-01 07:46:25

Угловое 2 (радиально-кли): Uncaught ReferenceError: Google не определен

ответ

Смежные вопросы