Angular 2 Send data between two components

Question

How to send data between tow components in Angular 2 application considering: - two components in two different routes ( thus, the only shared component is the root one)

I have managed to: - Use Shared services or Singleton however, how can I trigger the event from the first component to another ( that lies in the another routes )

I have managed to trigger the event using output to the last component before the root ( but not accross the root-app component)

Any help, links, clues appreciated!

<div class="wrapper">
   <div class="tasks-list">
    <router-outlet></router-outlet>
  </div>
<div  class="details">
    <task-details></task-details>
  </div>
</div>

this is app.component.html

I have a list of 'task.component' when clicking on of the itmes it should open in the 'task.details.component'. I hop I illustrated the idea in a good way.

You need to use a shared service https://angular.io/docs/ts/latest/cookbook/component-communication.html — Günter Zöchbauer, Jul 24 '16 at 12:57
I have mentioned that I used it, how I can trigger the click event? — ßastian, Jul 24 '16 at 13:03
What click event. Please add the code that demonstrates what you try to accomplish. — Günter Zöchbauer, Jul 24 '16 at 13:04
Possible duplicate of [How do i share data between components in Angular2?](http://stackoverflow.com/questions/31026886/how-do-i-share-data-between-components-in-angular2) — Kahbazi, Jul 24 '16 at 13:33
`@View()` is irrelevant, it's just old syntax. Move the properties to `@Component()` and be done (didn't check if there is other deprecated syntax used) — Günter Zöchbauer, Jul 25 '16 at 14:05

score 0 · Answer 1 · answered Oct 07 '16 at 09:17

Please go through this:

https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#bidirectional-service

A parent component and its children share a service whose interface enables bi-directional communication within the family.

The scope of the service instance is the parent component and its children. Components outside this component subtree have no access to the service or their communications.

score -1 · Answer 2 · answered Jul 24 '16 at 13:08

-1

Use the $rootScope. Create there variable, which will be visible from anywhere.

answered Jul 24 '16 at 13:08

Назар Костецький

11
2

1

There is no root scope in Angular2 – Günter Zöchbauer Jul 24 '16 at 13:34
also you can create global variable and add watcher for it – Назар Костецький Jul 25 '16 at 13:16

Angular 2 Send data between two components

2 Answers2