I have two divs with the same ng-controller in AngularJS, how can I make them share information?

Question

I have two different div tags in my html code referencing the same controller in AngularJS. What I suspect is that since these divs aren\'t nested they each have their own i

Answer 1

If I understand the question correctly, you want to sync two html areas with the same controller, keeping data synced.

since these divs aren't nested they each have their own instance of the controller, thus the data is different in both

This isn't true, if you declare the controllers with the same alias (I'm using more recente angular version):

  {{instance.someVar}}


  {{instance.someVar}} (this will be the same as above)

However, if you WANT them to be different and comunicate each other, you will have to declare different aliases:

  {{instance1.someVar}}


  {{instance2.someVar}} (this will not necessarily be the same as above)

Then you can use services or broadcasts to comunicate between them (the second should be avoided, tough).