ng-chat is a simple chat module similar to Facebook/LinkedIn for Angular apps.

File Upload: ng-chat supports attaching any type of file. To do this, you need to implement an API endpoint on your app that can receive a POST with a form file.

Required settings

• [adapter]{object}: This will point to your adapter’s implementation (‘MyAdapter‘ in the example above).
• [userid] {any}: The unique identifier of the user who will use the chat instance.

Must Read: Soft Alert or Chat Notifications To User On-screen By Angular 2.0+

How to make use of it:

Installation:

npm install ng-chat

1. Import NgChatModule on your AppModule (EG: app.module.ts):

...
import { NgChatModule } from 'ng-chat';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpClientModule,
    NgChatModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

2. Add the component to your AppComponent template:

<ng-chat [adapter]="adapter" [userId]="userId"></ng-chat>

3. And in your app.component.ts:

import { Component } from '@angular/core';
import { ChatAdapter } from 'ng-chat';
import { MyAdapter } from 'my-adapter';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';
  userId = 999;

  public adapter: ChatAdapter = new MyAdapter();
}

See Also –

Advanced Vue Live Chatroom Plugin On Website With Vue, React & Angular
💬 A Simple Chat Module Similar To Facebook/Linkedin for Angular Apps

See Demo And Download

Official Website(rpaschoal): Click Here

This superior jQuery/javascript plugin is developed by rpaschoal. For extra advanced usage, please go to the official website.