https://github.com/khalidsheet/ngx-communicate
Share data between any two components in an easy way!
https://github.com/khalidsheet/ngx-communicate
angular communicate communication ngx
Last synced: 21 days ago
JSON representation
Share data between any two components in an easy way!
- Host: GitHub
- URL: https://github.com/khalidsheet/ngx-communicate
- Owner: khalidsheet
- License: mit
- Created: 2019-11-15T17:22:09.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2023-01-07T11:50:43.000Z (about 3 years ago)
- Last Synced: 2025-05-20T16:00:49.057Z (11 months ago)
- Topics: angular, communicate, communication, ngx
- Language: HTML
- Homepage: https://www.npmjs.com/package/ngx-communicate
- Size: 1.93 MB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 26
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
[](https://www.codacy.com/manual/prog98rammer/ngx-communicate?utm_source=github.com&utm_medium=referral&utm_content=prog98rammer/ngx-communicate&utm_campaign=Badge_Grade) [](https://badge.fury.io/js/ngx-communicate)
# NgxCommunicate
**Share data between any two components in an easy way**
## Installation
```bash
npm i ngx-communicate
```
## Add the **NgxCommunicateModule** to your **AppModule**
```ts
@NgModule({
...
imports: [
...
NgxCommunicateModule.forRoot()
],
...
})
export class AppModule { }
```
## Use the Service
**To broadcast data**
```ts
this.communicate.broadcast("server:start", "Server Started");
```
**To receive data**
```ts
this.communicate.on("server:start", (data: any) => {
console.log(data);
});
```
---
## Example
```ts
import { NgxCommunicateService } from "ngx-communicate";
@Component({
selector: "app-root",
templateUrl: "./app.component.html",
styleUrls: ["./app.component.css"]
})
export class AppComponent implements OnInit {
constructor(private communicate: NgxCommunicateService) {}
ngOnInit() {
// Broadcasting a new event with it's data
this.communicate.broadcast("server:start", "Server Started");
// Receive the data for that event.
// Note: It can be used inside any other component.
this.communicate.on("server:start", (data: any) => {
console.log(data);
});
}
}
```
### License
MIT