Docs
Install

Angular

A provider at bootstrap, or a function in a component.

Packages are on their way to npm

Until @usejot/angular is published, the script tag in index.html does the same job today.

npm install @usejot/angular
src/main.ts
import { provideJot } from "@usejot/angular";

bootstrapApplication(AppComponent, {
  providers: [provideJot({ projectKey: "jot_pk_your_key" })],
});

From a component

jotInit(config) mounts the widget and returns a cleanup function. Call it in ngOnInit, clean up in ngOnDestroy:

import { jotInit } from "@usejot/angular";

export class AppComponent implements OnInit, OnDestroy {
  private cleanup = () => {};

  ngOnInit() {
    this.cleanup = jotInit({ projectKey: "jot_pk_your_key" });
  }

  ngOnDestroy() {
    this.cleanup();
  }
}

Every script option is a config key: trigger, edge, offset, environment, autostart.

On this page