-
-
Save sasxa/e1164d9773b31459f6dc to your computer and use it in GitHub Desktop.
import {Injectable, EventEmitter} from 'angular2/core'; | |
@Injectable() | |
export class EmitterService { | |
private static _emitters: { [ID: string]: EventEmitter<any> } = {}; | |
static get(ID: string): EventEmitter<any> { | |
if (!this._emitters[ID]) | |
this._emitters[ID] = new EventEmitter(); | |
return this._emitters[ID]; | |
} | |
} |
import {Component, Input, OnChanges} from 'angular2/core'; | |
import {EmitterService} from './emitter.service'; | |
@Component({ selector: 'dispatcher', template: '' }) | |
class DispatcherComponent implements OnChanges { | |
@Input() id: string; | |
private value = "dispatcher component value"; | |
doStuff() { | |
EmitterService.get(this.id).emit(value); | |
} | |
} | |
@Component({ selector: 'listener', template: '' }) | |
class ListenerComponent implements OnChanges { | |
@Input() id: string; | |
ngOnChanges() { | |
EmitterService.get(this.id).subscribe(value => console.log(value)); | |
} | |
} | |
@Component({ | |
providers: [EmitterService], | |
selector: 'host', | |
template: ` | |
<dispatcher [id]="host_id"></dispatcher> | |
<listener [id]="host_id"></listener> | |
` | |
}) | |
export class HostComponent { | |
public host_id: "HOST_COMPONENT"; | |
constructor(private _emitterService: EmitterService) {} | |
} |
EventEmitter is not meant to be used inside a service. They should be used only for emitting custom events inside components. You can use RxJS BehaviorSubject instead!
This very nice example, for communication between cross components.
I am facing below issues. Please help me.
Created one parent component and name is product component. inside product component i have two child component and these child components are siblings.
1, product info and
2, product details.
I am looping these siblings product from parent component.
In side product info component i have one button as a show details. When i click on show detail button needs to display in product detail component.
for acheving this i used event emmiter service.
When i subscribing event emitters service in product details component it's looping
I am facing below issues. Please help me.
Created one parent component and name is book-list component.and another one component is created if i click book-list component book title how to come book-details in book-details page
nice one .. thanks