tlimpanont / ngx-datable-ws-rxjs

Update ngx datatable with rxjs stream data. Data is delivered by json-server with Websocket implementation

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

NGX Datatable with Websocket and RxJs

Update ngx datatable with rxjs stream data. Data is delivered by json-server with Websocket implementation

npm start

will ng serve with nodemon json-server

Server will update json data with 1500ms interval

Angular Client App will listen to Websocket Event Type USER_ADDED

this.getMostRecentUsers$.subscribe((data) => {
  this.rows = data;
});

this.ws.onMessage$
.map((x) => JSON.parse(x.data))
.filter((x: any) => x.type === 'USER_ADDED')
.switchMap(() => this.getMostRecentUsers$)
.subscribe((users: any) => {
  this.rows = [...users];
});

demo animation

About

Update ngx datatable with rxjs stream data. Data is delivered by json-server with Websocket implementation


Languages

Language:TypeScript 64.7%Language:JavaScript 26.2%Language:HTML 6.1%Language:CSS 2.9%