javascript - Angular Google Maps モジュールが読み込まれない

Question

bower 経由で angular-google-maps を 2.0.1 に更新し、必要な依存関係 (bluebird、jquery、loadash) を追加しました。Google マップをコメント アウトすると、アプリは問題なく動作します。したがって、それは間違いなく 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 update）。

私は間違いを見つけようとしましたが、運がありませんでした。多分誰かがここで私を助けることができます。ありがとう！

Answer 1

モジュール名が変更されたため、更新します。

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

Answer 2

var app = angular.module('app', ['uiGmapgoogle-maps']);