Angular2 Google地图未在IE11中加载

时间:2017-04-28 16:12:16

标签: angular google-maps-api-3 internet-explorer-11

我正在尝试在我的angular2应用程序中加载谷歌地图。我在下面的链接实现,它在谷歌浏览器中工作正常。 https://angular-maps.com/docs/getting-started.html

在IE中,我在加载页面时遇到错误

Error: SyntaxError: Syntax error
at ZoneDelegate.prototype.invoke (http://localhost:35919/node_modules/zone.js/dist/zone.js:230:13)  
at Zone.prototype.run (http://localhost:35919/node_modules/zone.js/dist/zone.js:114:17) 
 at Anonymous function (http://localhost:35919/node_modules/zone.js/dist/zone.js:502:17)      
Evaluating http://localhost:35919/node_modules/angular2-google-maps/core/core.umd.js
Error loading http://localhost:35919/node_modules/angular2-google-maps/core/core.umd.js as "angular2-google-maps/core" from http://localhost:35919/app/app.module.js

我搜索了它并找到了以下链接来修复。它在构建解决方案时抛出了不同的错误。错误主要在lib.es6.d.ts文件中。

System js syntax error, IE11

My tsconfig.json

    {
      "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false,
        "noImplicitAny": true,
        "suppressImplicitAnyIndexErrors": true
      },
      "compileOnSave": true
    }

Package.json

    {
      "name": "angular2-quickstart",
      "version": "1.0.0",
      "description": "QuickStart package.json from the documentation, supplemented with testing support",
      "scripts": {
        "start": "tsc && concurrently \"tsc -w\" \"lite-server\" ",
        "docker-build": "docker build -t ng2-quickstart .",
        "docker": "npm run docker-build && docker run -it --rm -p 3000:3000 -p 3001:3001 ng2-quickstart",
        "pree2e": "npm run webdriver:update",
        "e2e": "tsc && concurrently \"http-server -s\" \"protractor protractor.config.js\" --kill-others --success first",
        "lint": "tslint ./app/**/*.ts -t verbose",
        "lite": "lite-server",
        "postinstall": "typings install",
        "test": "tsc && concurrently \"tsc -w\" \"karma start karma.conf.js",
        "test-once": "tsc && karma start karma.conf.js --single-run",
        "tsc": "tsc",
        "tsc:w": "tsc -w",
        "typings": "typings",
        "webdriver:update": "webdriver-manager update"
      },
      "keywords": [],
      "author": "",
      "license": "ISC",
      "dependencies": {
        "@angular/common": "2.4.1",
        "@angular/compiler": "2.4.1",
        "@angular/compiler-cli": "2.4.1",
        "@angular/core": "2.4.1",
        "@angular/forms": "2.4.1",
        "@angular/http": "2.4.1",
        "@angular/platform-browser": "2.4.1",
        "@angular/platform-browser-dynamic": "2.4.1",
        "@angular/platform-server": "2.4.1",
        "@angular/router": "3.4.1",
        "@angular/upgrade": "2.4.1",
        "angular2-google-maps": "^0.16.0",
        "angular2-in-memory-web-api": "0.0.15",
        "bootstrap": "^3.3.6",
        "core-js": "^2.4.0",
        "reflect-metadata": "^0.1.3",
        "rxjs": "5.0.0-beta.6",
        "systemjs": "0.19.27",
        "zone.js": "^0.6.12"
      },
      "devDependencies": {
        "concurrently": "^2.2.0",
        "lite-server": "^2.2.0",
        "typescript": "^2.2.0",
        "typings": "^1.0.4",
        "canonical-path": "0.0.2",
        "http-server": "^0.9.0",
        "tslint": "^3.7.4",
        "lodash": "^4.11.1",
        "jasmine-core": "~2.4.1",
        "karma": "^0.13.22",
        "karma-chrome-launcher": "^0.2.3",
        "karma-cli": "^0.1.2",
        "karma-htmlfile-reporter": "^0.2.2",
        "karma-jasmine": "^0.3.8",
        "protractor": "^3.3.0",
        "rimraf": "^2.5.2"
      },
      "repository": {}
    }

app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { AgmCoreModule } from 'angular2-google-maps/core';

@NgModule({
    imports: [
        BrowserModule,
        CommonModule,
        FormsModule,
        AgmCoreModule.forRoot({
            apiKey: 'key'
        })
    ],
    providers: [],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule { }

请告知。

1 个答案:

答案 0 :(得分:0)

我从" angular2-google-maps":" ^ 0.16.0"更改了谷歌地图版本to" angular2-google-maps":" ^ 0.17.0"在package.json中它起作用了。