角度谷歌地图模块未加载



>我有问题,找不到为什么角度看不到angular-google-maps

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.4.8/$injector/modulerr?p0=g4sMainModule&p1=Er…localhost%3A8080%2Fwebjars%2Fangularjs%2F1.4.8%2Fangular.min.js%3A19%3A463)(anonymous function) @ angular.js:38(anonymous function) @ angular.js:4458n @ angular.js:340g @ angular.js:4419eb @ angular.js:4344c @ angular.js:1676yc @ angular.js:1697Zd @ angular.js:1591(anonymous function) @ angular.js:29013j @ jquery.js:3099k.fireWith @ jquery.js:3211n.extend.ready @ jquery.js:3417I @ jquery.js:3433

HTML 注入的脚本(全部被找到并加载)

    <script src="webjars/jquery/2.1.4/jquery.min.js"></script>
<script src="webjars/angularjs/1.4.8/angular.min.js"></script>
<script src="webjars/lodash/4.0.0/lodash.min.js"></script>
<script src="webjars/angularjs/1.4.8/angular-route.min.js"></script>
<script src="webjars/angularjs/1.4.8/angular-resource.min.js"></script>
<script src="webjars/angularjs/1.4.8/angular-animate.min.js"></script>
<script src="webjars/angularjs/1.4.8/angular-aria.min.js"></script>
<script src="webjars/angular-material/1.0.1/angular-material.min.js"></script>
<script src="//maps.googleapis.com/maps/api/js"></script>
<script src="webjars/angular-google-maps/2.2.1/angular-google-maps.js"></script>

在模块中使用:

var module = angular.module('myModule', [ 'ngRoute','ngResource','uiGmapgoogle-maps', 'ngMaterial']);

如果我删除uiGmapgoogle-maps错误消失。

它可能与以下原因之一有关:

  • 不幸的是,lodash 4_.contains替换为 _.includes功能,这至少破坏了角度谷歌地图的2.2.1版本.js 更多细节可以在此线程中找到。解决方案:您可以使用以前的版本(3.10.1),因为它与angular-google-maps库兼容
  • angular-google-maps库(版本 2.2.X )包含对nemLogging模块的依赖关系。解决方案:添加对 nemLogging 库的引用

var app = angular.module('mapApp', ['ngRoute', 'ngResource', 'uiGmapgoogle-maps']);
app.controller('mapCtrl', function ($scope, uiGmapIsReady) {
    $scope.map = {
        center: {
            latitude: 55.711898,
            longitude: 9.5387363
        },
        zoom: 12,
        options: {
        },
        control: {}
    };
});
.angular-google-map-container {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}
<script src="https://code.angularjs.org/1.4.8/angular.js"></script>
<script src="https://code.angularjs.org/1.4.8/angular-route.min.js"></script>
<script src="https://code.angularjs.org/1.4.8/angular-resource.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.js"></script>
<script src="http://rawgit.com/nmccready/angular-simple-logger/master/dist/angular-simple-logger.js"></script>
<script src="http://rawgit.com/angular-ui/angular-google-maps/2.2.1/dist/angular-google-maps.js"></script> 
<div ng-app="mapApp" ng-controller="mapCtrl">
      <ui-gmap-google-map id="map" center="map.center" pan="map.pan" zoom="map.zoom" draggable="true" refresh="map.refresh" options="map.options" events="map.events" bounds="map.bounds" dorebuildall="true">
      </ui-gmap-google-map>
 </div>

最新更新