# Angular

Installation

npm install changelogfy-angular

Import our app.module.ts:

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

import { AppComponent } from "./app.component";
import { ChangelogfyModule } from "changelogfy-angular";

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

In your app.component.html

<div>
  <a class="changelogfy-widget" href="#">
    Open Widget
    <lib-changelogfy
      selector=".changelogfy-widget"
      appId="INSERT_YOUR_APP_ID_HERE"
    ></lib-changelogfy>
  </a>
</div>

You can enable or disable badge init:

initBadge="false"; // default true

Pro Plan

If you plan are in Pro Plan, you can pass user data for component:

app.component.html

<div>
  <a class="changelogfy-widget" href="#">
    Open Widget
    <lib-changelogfy
      selector=".changelogfy-widget"
      appId="INSERT_YOUR_APP_ID_HERE"
      userId="af12f993-1a0d-3cde-3144-89af158c39e3"
      userName="Paulo Castellano"
      userEmail="paulo@changelogfy"
      [customData]="{
                Job_Role: 'CEO',
                Plan: 'Pro',
                teammates: '4',
                Monthly_Spend: '50 USD'
              }"
    ></lib-changelogfy>
  </a>
</div>

Extras: