📡 Angular Event Service
An angular service to broadcast and listen global events. It works like Anagular@1 event service.
Installation
To install this library, run:
$ npm install angular-event-service --save
Using it
Once you have published your library to npm, you can import your library in any Angular application by running:
$ npm install angular-event-service
and then from your Angular AppModule
:
import { BrowserModule } from ' @angular/platform-browser ' ;
import { NgModule } from ' @angular/core ' ;
import { EventsServiceModule } from ' angular-event-service ' ;
@ NgModule ( {
declarations : [
AppComponent
] ,
imports : [
BrowserModule ,
EventsServiceModule . forRoot ( )
] ,
providers : [ ] ,
bootstrap : [ AppComponent ]
} )
export class AppModule { }
Once your library is imported, you can use it in your app like this:
import { Component } from ' @angular/core ' ;
import { EventsService } from ' angular-event-service ' ;
@ Component ( {
selector : ' app-root ' ,
templateUrl : ' ./app.component.html ' ,
styleUrls : [ ' ./app.component.css ' ]
} )
export class AppComponent {
private callbackListener : Function = ( payload : any ) => {
console . log ( payload ) ;
} ;
constructor ( private _eventsService : EventsService ) {
}
ngOnInit ( ) {
this . _eventsService . on ( ' test ' , this . callbackListener ) ;
}
ngAfterViewInit ( ) {
this . _eventsService . broadcast ( ' test ' , ' testPayload ' ) ;
setTimeout ( ( ) => {
this . _eventsService . broadcast ( ' test ' , ' testPayload2 ' ) ;
} , 1500 ) ;
}
ngOnDestroy ( ) {
this . _eventsService . destroyListener ( ' test ' , this . callbackListener ) ;
}
}
Make sure to destroy the listener once you destroy the component. If not, you will be registering references to events and calling different
references to the same callback each time the event occurs.
Development
To generate all *.js
, *.js.map
and *.d.ts
files:
To lint all *.ts
files:
License
MIT © Alex Torres