Reputation: 27972
This should be simple but I'm fairly new to Angular and really can't understand the documentation for UI-Map form the Angular UI team.
https://github.com/angular-ui/ui-map
There are a few things I don't understand so it's probably easier for me to number them.
1) The docs talk about using Bower to install which I don't use. It says I have to load UI-map and UI-event but I'm loading Angular UI from cdnjs.com, So I think that bundles all the directives I need, or am I wrong?
2) The docs say that I have to listen to the callback parameter when loading the Google Maps API using the following code..
function onGoogleReady() {
angular.bootstrap(document.getElementById("map"), ['app.ui-map']);
}
But I don't know what this is doing or where it is being called? Does google call this automatically when it's ready? Why is it attaching the map to an element with ID "map", surely I need to be able to dynamically use the map on many elements using the directive?
To add to the confusion, their own demo calls the function "initCall", instead of "onGoogleReady".
3) The docs say I have to add it as a dependency on my app module.
var myAppModule = angular.module('app.ui-map', ['ui.map']);
What is the app. before ui-map? My current app declaration looks like this and only has dependencies named in the array...
var portal = angular.module('portal', ['ngAnimate','ui.router', 'ui.bootstrap', 'restangular'])
Maybe I'm being really stupid, but I added 'ui-map' into the array but it didn't seem to work :(
I know this might seem easy to some but as I said I'm new to Angular and still don't totally get how dependency injection works or what order things are loaded/initialized in. Any help would really be appreciated.
Upvotes: 2
Views: 348
Reputation: 27972
It doesn't look like Angular UI maps is supported any more (I might be wrong), so I used Angular Google Maps instead.
http://angular-google-maps.org/
Upvotes: 2