Package Exports
- @inelo/angular-livechat-widget
- @inelo/angular-livechat-widget/bundles/inelo-angular-livechat-widget.umd.js
- @inelo/angular-livechat-widget/fesm5/inelo-angular-livechat-widget.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@inelo/angular-livechat-widget) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Livechat Widget for Angular
Library to integrate LiveChat Widget with your Angular App.
Demo
StackBlitz live example.
Installation
npm install --save @livechat/angular-widget
Usage
Import LivechatWidgetModule in Angular AppModule.
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { LivechatWidgetModule } from '@livechat/angular-widget'
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
LivechatWidgetModule,
],
providers: [],
bootstrap: [
AppComponent,
]
})
export class AppModule { }Use the LiveChat Angular Widget in your template:
<livechat-widget licenseId="10073628"></livechat-widget>As optional parameters, you can define:
groupchatBetweenGroupsparamsvisitorgaVersion
To get more details about usage of the optional paramteres please read our tracking code documentation.
Access to the LiveChat Widget API using callback method
<livechat-widget licenseId="10073628" (onChatLoaded)="onChatLoaded($event)"></livechat-widget>import { Component } from '@angular/core';
import { LiveChatWidgetApiModel } from '@livechat/angular-widget';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
})
export class AppComponent {
liveChatApi: LiveChatWidgetApiModel
constructor() { }
onChatLoaded(api: LiveChatWidgetApiModel) {
this.liveChatApi = api;
}
}Access to the LiveChat Widget API using @ViewChild decorator
<livechat-widget #liveChatWidget licenseId="10073628" ></livechat-widget>import { Component, ViewChild, OnInit, OnDestroy } from '@angular/core';
import { LiveChatWidgetModel } from '@livechat/angular-widget';
import { Subscription } from 'rxjs';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
})
export class AppComponent implements OnInit, OnDestroy {
@ViewChild('liveChatWidget') liveChatWidget: LiveChatWidgetModel;
liveChatWidget$: Subscription = new Subscription();
liveChatApi: LiveChatWidgetApiModel;
constructor() { }
ngOnInit(): void {
this.liveChatWidget$ = this.liveChatWidget.onChatLoaded.subscribe((api: LiveChatWidgetApiModel) => this.liveChatApi = api)
}
ngOnDestroy(): void {
this.liveChatWidget$.unsubscribe();
}
}