How to use angular-google-maps <markers> directive?
As you figured out, it's stated in here: http://angular-ui.github.io/angular-google-maps/#!/api/markers that the value of the property coords must be between quotes.
Also, in v1.1, for each marker you need to define an id (the name of the id property is given by idKey), which defaults to model.id,
so, in your case, and for it to work now it would have to be
<markers models="vehicles" coords="'last_known_location'"></markers>
and the vehicles array, for instance:
$scope.vehicles = [{ id: "first", stuff: "stuff", last_known_location: { latitude: 37.3694868, longitude: -5.9803275 }}];
(Notice the id property)
I don't think you need to define the array again after you already defined it for you models. Can you try:
<markers models='vehicles' coords='last_known_location'> </markers>
If you didn't have them within last_known_location and just within the parent object, the API says you can use 'self' to identify the the objects contain lat and lng
Two things:
First, add []
to your definition of last_known_location
in order to make it an array of objects. In this test page for Angular Google Maps, the coords do not work without it. http://www.directiv.es/angular-google-maps
Second, make sure vehicles
is accessible to your module. The best way to do that is by making it a part of $scope
.
angular.extend($scope, { vehicles: stuff = "stuff", last_known_location: [{ latitude: 45, longitude: -74 }] });
Then the markup in @jOshT's response will work:
<marker models='vehicles' coords='last_known_location'> </markers>
UPDATE
Per comments, I misunderstood that this implementation is using markers instead of marker. The former requires the coords
object to be a string
and the later requires an expression
. Serializing the last_known_location
with the original code will work.