NgxChatbox

ngx-chatbot is an Angular component for creating chat-box.It can be used to simulate chatbot.

Demo

https://codesandbox.io/s/ngx-chatbox-demo-50jxh

Installation

To use ngx-chatbox in your project install it via npm:

npm i ngx-chatbox

Usage example

AppModule.ts

import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";

import { AppComponent } from "./app.component";
import { NgxChatboxModule } from "ngx-chatbox";
import { CommonModule } from "@angular/common";
import { FormsModule } from "@angular/forms";
@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule, NgxChatboxModule, CommonModule, FormsModule],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

app.component.html

<ngx-chatbox
  [chatConfig]="config"
  (onMessageInput)="getMessage($event)"
  [serverResponse]="response">
  </ngx-chatbox>

app.component.ts

export class AppComponent {
  title = "chat-float";
  response = "";
  config = {
    title: "ChatBot",
    subTitle: "New Way of learning"
  };
  setData(message) {
    this.response = message;
  }
  getMessage($event) {
    console.log($event);
  }
}

License