Simultaneously renumbering a Collection's ListViews in Backbone.js

I'm using backbone.js and I have (1) a list View with the items in a collection, and (2) a map with markers for the items in the collection. The ListView a开发者_JAVA百科nd Markers are numbered so the user knows which item in the list view corresponds to which marker.

This is a view that allows users to add and remove locations, thus I need to renumber the list and markers on each add and remove event. For example.

collection: [1, 2, 3, 4, 5]

remove: [3]

collection before re-indexed: [1, 2, 4, 5]

collection re-indexed: [1, 2, 3, 4]

....however, here's the catch, the numbers in the list need to match their respective markers on the map.

What is the best way to go about doing this? Should I have one view that controls both the list view and map at the same time and performs the re-indexing or should I have one view for the list and one for the map and have them both listen for changes to the model. If I go with the two-views options, how to I make sure that the list-view items and markers are numbered correctly after re-indexing?

You should have two different views attached to the same collection.

To prevent your from needing any manual numbering and bookkeeping, you could use the index of the model object in the collection as your identifier.

This way, your map marker and your list item will automatically always get the same identifier.