The Author Online Book Forums are Moving

The Author Online Book Forums will soon redirect to Manning's liveBook and liveVideo. All book forum content will migrate to liveBook's discussion forum and all video forum content will migrate to liveVideo. Log in to liveBook or liveVideo with your Manning credentials to join the discussion!

Thank you for your engagement in the AoF over the years! We look forward to offering you a more enhanced forum experience.

435996 (1) [Avatar] Offline
I'm working on angular2 application. And got one question about data sharing. I've found many tutorials how to share data between parent<->child components, but i haven't found answer on question - how to share data to component what is on the same level. In my app i use ui-router-ng2 to display main page content where i render components like sign in/up, profile page etc.
Main app html file:

<div class="main-container container">
Imagine what in ui-view shows login component and after success login i have to pass data to header component with user info. how could i do it?
Yakov Fain (219) [Avatar] Offline
I'm not familiar with ui-router-ng2 and don't know why would someone use this 9 month old software as opposed to the component router that comes with Angular 2. I'll give you an answer for the case when components that can be shown in the router outlet need to receive the data that are available in another component (Login in your case).

Since your Login and Header component may not exist at the same time in DOM, you need a common service (e.g. UserService) that is injected in both Login and Header components. In the Login component your can set the user info on UserService, and the HeaderComponent will receive the instance of UserService via its constructor and you can get the user info from this service.