ng-analytics (alpha)

Angular Analytics Abstraction

Usage

Import the module

...
@NgModule(
    {
      imports [..., NgAnalyticsModule]
      ...
    }
)
...

Inject the service

constructor(ngAnalytics: NgAnalytics)

Setup preferred analytics

this.ngAnalytics.support([new NgAnalyticsGoogle(), new NgAnalyticsMixPanel()])

Sample event trigger

this.ngAnalytics.track('event', {eventCategory: 'video', eventAction: 'first play'})

Support Custom Analytics

Implement NgAnalyticsInterface

export class MyCustomAnalytics implements NgAnalyticsInterface {
  ....
}

Add your custom class

this.ngAnalytics.support([...,new MyCustomAnalytics()]);

Using ngaTrack directive

In your HTML, catch click and mouseover events to send tracking properties

<button ngaTrack="event"
        [ngaTriggerEvent]="['click', 'mouseover']"
        [ngaProperties]="{eventCategory: 'button', eventAction: 'clicked or mouseover'}">
</button>

This is equivalent to

if (click || mouseover) {
  this.ngAnalytics.track("event", {eventCategory: 'button', eventAction: 'clicked or mouseover'});
}

Credits

Npm packaging template

License

MIT