有谁知道如何将谷歌地图添加到角度2应用程序？

Question

有谁知道如何将谷歌地图添加到角度2应用程序？

我目前正在index.html页面中链接到它,如下所示:

   <script src="node_modules/angular2-google-maps/bundles/angular2-google-maps.js"></script>

但是在我的angular 2组件中使用它时会出现此控制台错误:

system.src.js:1061 GET http:// localhost:3000/angular2-google-maps/core 404(Not Found)

这是我的控制台的屏幕截图:

系统配置:

System.config({
  packages: {      
    app: {
      format: 'register',
      defaultExtension: 'js'
    },
    'angular2-google-maps': { defaultExtension: 'js' }
  }
});
System.import('app/boot')
      .then(null, console.error.bind(console));

Answer 1

经过长时间的研究后,我找到了以下解决方案,

一旦我们安装了Angular2-google-maps,我们忘记在配置中映射js文件.

打开你的systemjs.config.js

并'angular2-google-maps/core': 'npm:angular2-google-maps/core/core.umd.js'在地图目录中添加 .

我的代码:

map: {
      // our app is within the app folder
      app: 'app',
      // angular bundles
      '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
      '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
      '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
      '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
      '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
      '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
      // other libraries
      'rxjs':                       'npm:rxjs',
      'angular2-in-memory-web-api': 'npm:angular2-in-memory-web-api',
     'angular2-google-maps/core': 'npm:angular2-google-maps/core/core.umd.js'
    },

它可能会帮助某人.谢谢!.