2.6 KiB
2.6 KiB
ngx-pendo-lite
A lightweight Angular wrapper for Pendo.io analytics integration.
Installation
npm install ngx-pendo-lite --save
Setup
1. Import the Module
Import the PendoModule in your AppModule and configure it with your Pendo API key:
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { PendoModule } from 'ngx-pendo-lite';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
PendoModule.forRoot({
apiKey: 'YOUR_PENDO_API_KEY'
})
],
bootstrap: [AppComponent]
})
export class AppModule { }
2. Identify Users (after login)
After a user logs in to your application, identify them to Pendo:
import { Component } from '@angular/core';
import { PendoService } from 'ngx-pendo-lite';
@Component({
selector: 'app-login',
template: `...`
})
export class LoginComponent {
constructor(private pendoService: PendoService) {}
onLoginSuccess(user: any): void {
this.pendoService.identify(
user.id,
user.organizationId,
{
email: user.email,
fullName: user.fullName,
role: user.role
},
{
name: user.organizationName,
tier: user.subscriptionTier
}
);
}
}
3. Track Custom Events
Track user interactions and custom events:
import { Component } from '@angular/core';
import { PendoService } from 'ngx-pendo-lite';
@Component({
selector: 'app-feature',
template: `...`
})
export class FeatureComponent {
constructor(private pendoService: PendoService) {}
onFeatureUsed(): void {
this.pendoService.track('feature_used', {
featureName: 'example-feature',
timestamp: new Date().toISOString()
});
}
}
API Reference
PendoService
Methods
initialize(config: PendoConfig): void- Initialize the Pendo serviceidentify(visitorId: string, accountId: string, visitorData?: Record<string, any>, accountData?: Record<string, any>): void- Identify a user and accounttrack(eventName: string, metadata?: Record<string, any>): void- Track a custom eventupdateVisitor(visitorData: Record<string, any>): void- Update visitor informationupdateAccount(accountData: Record<string, any>): void- Update account informationdisable(): void- Disable Pendo tracking
Interfaces
interface PendoConfig {
apiKey: string;
visitor?: {
id: string;
[key: string]: any;
};
account?: {
id: string;
[key: string]: any;
};
}
License
MIT