Performing iteration over array in ui-gmap-window Angular Google Map plugin

Question

I am using

<ui-gmap-windows>

element in Angular, and I need to show the content of dynamic array inside the marker. I tried using ng-repeat, but it did not work. Basically, I need that when the user clicks on a marker, the info window should show the list of items associated with that marker.

Its hard to suggest anything by just <ui-gmap-windows>, please show your controller.js especially how you set up the markers. — Kay_N
– Kay_N, Commented Sep 3, 2015 at 21:57

Tim Smart · Accepted Answer · 2015-11-27 08:40:09Z

1

You should associate the list with the marker itself.

so when you create your marker in Angular try this

var markers = [];

for(var i = 0; i < latLng.length; i++){
    markers.push({
        id: i,
        ...
        ...
        myList:[{...},{...}]
    });
}

Your html should look something like this:

<ui-gmap-google-map...
   <ui-gmap-marker ng-repeat="m in markers"...
      <ui-gmap-window...

         [Your Info Window Content Here]

         <div>{{m.myList[0].stuff}}</div>
         <div>{{m.myList[1].stuff}}</div>
         <div>{{m.myList[2].stuff}}</div>

      </ui-gmap-window>
   </ui-gmap-marker>
</ui-gmap-google-map>

As you can see, you can pull data from the parent marker collection (m, defined in ui-gmap-marker) and use it in any of its children.

answered Nov 27, 2015 at 8:40

Tim Smart

1781 silver badge13 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Performing iteration over array in ui-gmap-window Angular Google Map plugin

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related