NGX BROADCASTER is a library that provides the service for Angular applications to access global emitted events from components, service etc..
npm install ngx-broadcaster
Refer NPM package here.
import { NgBroadcasterModule } from 'ngx-broadcaster';
@NgModule({
declarations: [
AppComponent,
SampleComponent
],
imports: [
BrowserModule,
NgBroadcasterModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
Sample.component.html
<button (click)="sendMessage()">Send Message</button>
Sample.component.ts
// Selector : app-component
constructor(private broadcaster:NgBroadcasterService) {}
ngOnInit() {}
sendMessage(){
let data = {
message:"Hello World"
}
this.broadcaster.emitEvent('test-event',data);
}
App.component.html
<h1>{{message}}</h1>
<br>
<app-sample></app-sample>
App.component.ts
public message:string;
constructor(private broadcaster:NgBroadcasterService){}
ngOnInit(){
this.broadcaster.listen('test-event').subscribe(res=>{
this.message = res.message;
})
}
Event Payload Interface
export interface EventPayload{
eventName:string;
eventData:any;
}
This project is licensed under the terms of the MIT license.
If you have ideas for more that should be on this page, let me know