Angular2, keep models sync between components
<p>I'm considering moving to Angular2 from my trusted backbone (or should I say, my boss wants to play with a new toy, which is fine by me), I searched a lot online and made some tests but I can't seem to find the answer to this simple question:</p>

<p>Can I keep 2 models in sync between two components ? Exemple: I have a list of users on the sidebar, which is one component, and a form to edit said users in my "main page", which is another component.</p>

<p>The sidebar is responsible for getting its collection to display, and the form is responsible for getting its model. When the model is updated, I want the changes to be reflected in the sidebar, without going through the server again.</p>

<p>I know SpinJS does this and I hacked something in Backbone using events to achieve the same thing (based on model class and id), but I wonder if Angular2 has a native way of handling that ?
If not, how would one go with implementing this kind of behavior ?</p>

<p>Thanks.</p>

<p>EDIT:</p>

<p>I added my test files in this Plunker: <a href="http://plnkr.co/edit/jIdnu68ZDMDSFJkomN3Y" rel="nofollow">http://plnkr.co/edit/jIdnu68ZDMDSFJkomN3Y</a></p>

<p>First, select a hero, and click "view details", this will make an <code>http.get</code> request to the in-memory server to get the Hero.</p>

<p>Second, click on "Give sword", this will add a Weapon to the selected user.
For testing purposes, instead of using the already-loaded user, I request the same one using <code>http.get</code> again.</p>

<p>When I change the name in the textbox, the name of the second instance isn't updated.</p>

<p>You have to imagine that I can't use the current instance of hero for whatever reasons, I want to request it again from the server.</p>