Google Map API无法与Angular 2配合使用

时间:2018-06-18 14:11:27

标签: javascript angular google-maps typescript google-maps-api-3

我正面临Google Map API的问题。我已将google地图API CDN包含在我的 index.html 文件中,如下所示:

<script src="https://maps.googleapis.com/maps/api/js?key=KEY&language=de" type="text/javascript"></script> 

但它在控制台中出现错误,如下所述

'google is not defined'

比我将Google MAP CDN包含在webpack的 vendor.ts 文件中。之后,我可以看到全局 window.google 对象,但它没有附加任何功能。

  

请参阅正确控制台和错误控制台的屏幕截图。

正确的图片 correct image

图片不正确 incorrect image

这是我的 package.json 文件

 { 
 "name": "angular2-webpack",
 "version": "1.0.0",
 "description": "A webpack starter for Angular",
 "scripts": {
   "start": "webpack-dev-server --inline --progress --port 8080",
   "test": "karma start",
   "build": "rimraf dist && webpack --config config/webpack.prod.js --progress --profile --bail"
 },
 "license": "MIT",
 "dependencies": {
   "@angular/common": "~2.4.0",
   "@angular/compiler": "~2.4.0",
   "@angular/core": "~2.4.0",
   "@angular/forms": "~2.4.0",
   "@angular/http": "~2.4.0",
   "@angular/platform-browser": "~2.4.0",
   "@angular/platform-browser-dynamic": "~2.4.0",
  "@angular/router": "~3.4.0",
  "bootstrap": "^3.3.7",
  "core-js": "^2.4.1",
  "dragula": "^3.7.2",
  "fullcalendar": "^3.0.1",
  "highcharts": "^5.0.9",
  "jquery": "^3.1.1",
  "jquery-mousewheel": "^3.1.13",
  "jquery-ui": "^1.12.1",
  "moment": "^2.17.1",
  "ng2-dragula": "^1.3.0",
  "primeng": "^2.0.2",
  "rxjs": "5.0.1",
  "webpack-strip": "^0.1.0",
  "zone.js": "^0.7.4"
},
"devDependencies": {
  "@types/google-maps": "^3.2.0",
  "@types/jasmine": "2.5.36",
  "@types/jquery": "^2.0.41",
  "@types/node": "^6.0.45",
  "angular2-template-loader": "^0.6.0",
  "awesome-typescript-loader": "^3.0.4",
  "css-loader": "^0.26.1",
  "extract-text-webpack-plugin": "2.0.0-beta.5",
  "file-loader": "^0.9.0",
  "html-loader": "^0.4.3",
  "html-webpack-plugin": "^2.16.1",
  "jasmine-core": "^2.4.1",
  "karma": "^1.2.0",
  "karma-chrome-launcher": "^2.0.0",
  "karma-jasmine": "^1.0.2",
  "karma-sourcemap-loader": "^0.3.7",
  "karma-webpack": "^2.0.1",
  "null-loader": "^0.1.1",
  "raw-loader": "^0.5.1",
  "rimraf": "^2.5.2",
  "style-loader": "^0.13.1",
  "typescript": "~2.2.2",
  "url-loader": "^0.5.9",
  "webpack": "2.2.1",
  "webpack-bundle-size-analyzer": "^2.6.0",
  "webpack-dev-server": "2.4.1",
  "webpack-merge": "^3.0.0"
 }
}

0 个答案:

没有答案