javascript - Angular Google map 模块无法加载

标签 javascript angularjs google-maps angular-google-maps

我刚刚通过 Bower 将 angular-google-maps 更新到 2.0.1 并添加了所需的依赖项(bluebird、jquery、loadash)。当我注释掉谷歌地图时,我的应用程序运行得很好。所以它肯定与 angular-google-maps 有关

bower.json 依赖项:

"dependencies": {
    "angular-route": "~1.2.21",
    "angular-sanitize": "~1.2.21",
    "angular-strap": "~2.0.5",
    "angular-animate": "~1.2.21",
    "angular-resource": "~1.2.21",
    "underscore": "~1.6.0",
    "angular": "~1.2.21",
    "jquery": "~2.1.1",
    "bootstrap": "~3.2.0",
    "angular-bootstrap": "~0.11.0",
    "angular-google-maps": "~2.0.1"
  }

这是加载的库:

<script src="/bower_components/jquery/dist/jquery.min.js"></script>
<script src="/bower_components/underscore/underscore.js"></script>
<script src="/bower_components/lodash/dist/lodash.underscore.min.js"></script>
<script src="/bower_components/bluebird/js/browser/bluebird.js"></script>
<script src="/bower_components/angular/angular.min.js"></script>
<script src="/bower_components/angular-route/angular-route.min.js"></script>
<script src="/bower_components/angular-sanitize/angular-sanitize.min.js"></script>
<script src="/bower_components/angular-resource/angular-resource.min.js"></script>
<script src="/bower_components/angular-animate/angular-animate.min.js"></script>
<script src="/bower_components/angular-google-maps/dist/angular-google-maps.min.js"></script>
<script src="/bower_components/angular-loading-bar/build/loading-bar.min.js"></script>
<script src="/bower_components/angular-bootstrap/ui-bootstrap.min.js"></script>
<script src="/bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>
<script src="bower_components/angular-ui-utils/ui-utils.js"></script>
<script src="bower_components/angular-translate/angular-translate.min.js"></script>
<script src="bower_components/angular-dialogs/angular-dialog.min.js"></script>
<script src="/bower_components/angular-i18n/angular-locale_de.js"></script>

这里我加载我的应用程序:

  var app = angular.module('app', [
    'ngRoute',
    'ngSanitize',
    'ngResource',
    'ngAnimate',
    'google-maps', // when I take this out, my app works... 
    'angular-loading-bar',
    'ui.bootstrap',
    'ui.utils',
    'AppControllers',
    'AppFactories',
    'AppDirectives',
  ]);

app.config(['GoogleMapApiProvider'.ns(), function (GoogleMapApi) {
        GoogleMapApi.configure({
            key: '*********',
            v: '3.17',
            libraries: 'weather,geometry,visualization'
        });
  }]);

我收到的错误消息:

Failed to instantiate module app due to:
Error: [$injector:modulerr] http://errors.angularjs.org/1.2.26/$injector/modulerr?p0=...)
    at Error (native)
    at http://localhost:8000/bower_components/angular/angular.min.js:6:450
    at http://localhost:8000/bower_components/angular/angular.min.js:34:97
    at r (http://localhost:8000/bower_components/angular/angular.min.js:7:290)
    at e (http://localhost:8000/bower_components/angular/angular.min.js:33:207)
    at http://localhost:8000/bower_components/angular/angular.min.js:33:284
    at r (http://localhost:8000/bower_components/angular/angular.min.js:7:290)
    at e (http://localhost:8000/bower_components/angular/angular.min.js:33:207)
    at gc (http://localhost:8000/bower_components/angular/angular.min.js:36:309)
    at c (http://localhost:8000/bower_components/angular/angular.min.js:18:170

我真的不知道是什么破坏了模块,我已经检查了我的 Bower 链接,更新了所有依赖项(Bower 更新)。

我一直在尝试找出错误,但没有运气。也许有人可以在这里帮助我。谢谢!

最佳答案

他们更改了模块名称,因此更新它:

var app = angular.module('app', [
    'ngRoute',
    'ngSanitize',
    'ngResource',
    'ngAnimate',
    'google-maps'.ns(), // new namespace
    'angular-loading-bar',
    'ui.bootstrap',
    'ui.utils',
    'AppControllers',
    'AppFactories',
    'AppDirectives',
  ]);

作为第 4 点的更新。https://angular-ui.github.io/angular-google-maps/#!/use

关于javascript - Angular Google map 模块无法加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26449429/

相关文章:

javascript - 对事件目录进行 ajax 调用并使用 post 提取缩略图照片

javascript - 如何重置模态主体

angularjs - 无法使用 ng new 命令创建项目

search - AngularJS 搜索更改事件

javascript - 谷歌地图自定义控件回调

java - 有没有办法更改 Android Google Map API 的 map 数据?

javascript - Rest API,在路由中哪里放置大量计算?

JavaScript 制表符 + 控制链接

javascript - 在 Angular 工厂的函数中设置变量

swift - 如何获取Marker的经纬度Swift