Events is a publish-subscribe style event system based on sqlProvider/angular2-pubsub and modified to be similar to ionic-angular/Events.
-
Import service in your codes or download via npm.
- Angular 4:
npm install --save [email protected] - Angular 5:
npm install --save [email protected] - Angular 6:
npm install --save [email protected] - Angular 8:
npm install --save [email protected] - Angular 10:
npm install --save [email protected] - Angular 11:
npm install --save [email protected] ⚠️ Version 5.0.1 is incompatible with Angular 5 and should have been version 6.0.0.
- Angular 4:
-
Add module bundle to imports in your application.
...
import { EventsModule } from 'angular4-events';
@NgModule({
declarations: [
...
],
imports: [
...
EventsModule.forRoot()
]
})
...- And import service wherever you want
declare class EventsService {
private events: Object;
publish(event: string, eventObject?: any): void;
subscribe(): undefined;
subscribe(event: string): Observable<any>;
subscribe(event: string, callback: (value: any) => void): Subscription;
subscribe(event: string, callback: (value: any) => void, error: (error: any) => void): Subscription;
subscribe(event: string, callback: (value: any) => void, error: (error: any) => void, complete: () => void): Subscription;
}Publish event to all subscriber.
etc.
export class OverlayComponent implements OnInit, OnDestroy {
constructor(private events: EventsService) { }
anyFunc(){
this.events.publish('pleaseCloseSidenav', 'helloIAmOverlay');
}
}Subscribe to channel.
etc.
export class NavigationComponent implements OnInit, OnDestroy {
sideanvSub: any;
constructor(private pubsub: EventsService) { }
ngOnInit() {
// usage of subscribe(event: string): <Observable<any>>;
this.closeSidenavSub = this.pubsub.subscribe('pleaseCloseSidenav').subscribe((from) => {
this.sidenavOpened = false;
});
// usage of subscribe(event: string, callback: (value: any) => void, error?: (error: any) => void, complete?: () => void): Subscription;
this.openSidenavSub = this.pubsub.subscribe('pleaseOpenSidenav', (from) => {
this.sidenavOpened = true;
});
}
ngOnDestroy() {
this.closeSidenavSub.unsubscribe();
this.openSidenavSub.unsubscribe();
}Follow the steps to run the tests and build the source code.
npm install
npm test
npm run buildCommands above will generate the ready to use bundles under the ./dist folder.