Getting error “Error: $injector:modulerr Module Error”
Question
I want to use angular-google-map api, but getting error : "Error: $injector:modulerr Module Error"
I want to test Google-map-api using browser key. I got this tutorial form How to use google-map-key
I tried to run but getting above error. Please see the demo for using Google-Map Key DEMO
2 answers
solution1
3 2015-10-20 19:39:17
version 2.2.x of google maps has an additional dependency on nemLogging . If you use the non-minified versions of your libraries you get the following error:
Uncaught Error: [$injector:modulerr] Failed to instantiate module customMap due to:
Error: [$injector:modulerr] Failed to instantiate module uiGmapgoogle-maps due to:
Error: [$injector:modulerr] Failed to instantiate module uiGmapgoogle-maps.directives.api due to:
Error: [$injector:modulerr] Failed to instantiate module uiGmapgoogle-maps.directives.api.models.parent due to:
Error: [$injector:modulerr] Failed to instantiate module uiGmapgoogle-maps.directives.api.models.child due to:
Error: [$injector:modulerr] Failed to instantiate module uiGmapgoogle-maps.directives.api.utils due to:
Error: [$injector:modulerr] Failed to instantiate module uiGmapgoogle-maps.extensions due to:
Error: [$injector:modulerr] Failed to instantiate module uiGmapgoogle-maps.providers due to:
Error: [$injector:modulerr] Failed to instantiate module nemLogging due to:
Error: [$injector:nomod] Module 'nemLogging' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
The new dependency is discussed on this github issue . I would recommend either including that new library, or using the version specified in your guide (2.0.16)
solution2
1 2015-10-22 21:07:30
It seems the same issue has been reported in angular-google-maps repository. The solution would be to explicitly add a reference to angular-simple-logger
Example
angular.module('appMaps', ['uiGmapgoogle-maps','nemLogging']) .config(function (uiGmapGoogleMapApiProvider) { uiGmapGoogleMapApiProvider.configure({ //key: 'PUT YOUR KEY HERE', v: '3.17', //libraries: 'weather,geometry,visualization' }); }) .controller("mapController", function ($scope, uiGmapGoogleMapApi) { // Define variables for our Map object var areaLat = 44.2126995, areaLng = -100.2471641, areaZoom = 3; uiGmapGoogleMapApi.then(function (maps) { $scope.map = { center: { latitude: areaLat, longitude: areaLng }, zoom: areaZoom }; $scope.options = { scrollwheel: false }; }); });
html, body, #map_canvas { height: 100%; width: 100%; margin: 0px; } #map_canvas { position: relative; } .angular-google-map-container { position: absolute; top: 0; bottom: 0; right: 0; left: 0; }
<script src="https://code.angularjs.org/1.3.14/angular.js"></script> <script src="http://rawgit.com/nmccready/angular-simple-logger/master/dist/angular-simple-logger.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-google-maps/2.2.1/angular-google-maps.min.js"></script> <body ng-app="appMaps"> <div id="map_canvas" > <div ng-controller="mapController"> <ui-gmap-google-map center="map.center" options="options" zoom="map.zoom"></ui-gmap-google-map> </div> </div> </body>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.