Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

ngx-matomo-client

EmmanuelRoux77kMIT7.1.0TypeScript support: included

Matomo (fka. Piwik) client for Angular applications

matomo, piwik, angular, analytics

readme

matomo-logo ngx-matomo-client
Matomo Analytics client for Angular

Angular 19  NPM latest version  MIT license  semantic-release  Sponsorship


matomo-logo
Matomo is the Google Analytics alternative that protects your data and your customers' privacy.
Matomo is exempt from consent to tracking in some countries (recommended by the CNIL in France).

https://matomo.org/


Note: this library was previously distributed as @ngx-matomo/tracker and @ngx-matomo/router packages. Since version 5, it is now distributed as a single package ngx-matomo-client. Follow instructions below for how to easily migrate.

NPM version


Compatibility table:

Matomo Angular ngx-matomo-client @ngx-matomo/tracker
@ngx-matomo/router
3 or 4 9 to 12 | 1.x (docs)
3 or 4 13 | 2.x (docs)
3 or 4 14 | 3.x (docs)
3 or 4 15 5.x (docs) 4.0.x (docs)
3, 4 or 5 16 5.x (docs) 4.x (docs) (deprecated)
3, 4 or 5 17 6.x
3, 4 or 5 18 6.2.x or above
3, 4 or 5 19 7.x

build CodeQL Coverage Status code style: prettier

Installation

Run ng add ngx-matomo-client

This will prompt you for some information such as your Matomo's server address and site ID. You can find your site ID in Matomo admin panel.

This command will set up basic configuration into your root AppModule (use ng add ngx-matomo-client --module [module] to specify a different root module). You can then take a look at configuration reference for fine-grained set-up.

<summary>If you're not using Angular CLI, follow these instructions instead</summary>

Run npm install --save ngx-matomo-client or yarn add ngx-matomo-client then manually import Matomo into your Angular application:

import { provideMatomo } from 'ngx-matomo-client';

await bootstrapApplication(RootComponent, {
  providers: [
    provideMatomo({
      siteId: 1,
      trackerUrl: 'http://my-matomo-instance',
    }),
  ],
});

Or, if you use @NgModule:

import { MatomoModule } from 'ngx-matomo-client';

@NgModule({
  imports: [
    MatomoModule.forRoot({
      siteId: 1,
      trackerUrl: 'http://my-matomo-instance',
    }),
  ],
})
export class AppModule {}

Take a look at configuration reference for all available configuration properties.

Note: in this documentation, all code examples use imports from ngx-matomo-client because this is the most common use case. If you don't have @angular/router in you application, you must import from ngx-matomo-client/core instead.

See FAQ for more details.

Usage

Tracking page views

Enable automatic page view tracking by adding withRouter() feature to provideMatomo():

import { provideMatomo, withRouter } from 'ngx-matomo-client';

await bootstrapApplication(RootComponent, {
  providers: [
    provideMatomo(
      {
        siteId: 1,
        trackerUrl: 'http://my-matomo-instance',
      },
      withRouter(),
    ),
  ],
});
<summary>See equivalent configuration with @NgModule</summary>
import { MatomoModule, MatomoRouterModule } from 'ngx-matomo-client';

@NgModule({
  imports: [
    MatomoModule.forRoot({
      siteId: 1,
      trackerUrl: 'http://my-matomo-instance',
    }),
    MatomoRouterModule,
  ],
})
export class AppModule {}

This will track every page view using Angular Router.

If you wish to manually track page views instead, inject MatomoTracker and call trackPageView() or other desired methods (setCustomUrl, setReferrerUrl...):

import { MatomoTracker } from 'ngx-matomo-client';

@Component({
  selector: 'app-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.scss'],
})
export class ExampleComponent implements OnInit {
  private readonly tracker = inject(MatomoTracker);

  ngOnInit() {
    this.tracker.trackPageView();
  }
}

Adding info or customizing automatic page view tracking

By default, Matomo detects page title and url. Page title is read from Angular's Title service (which itself is filled with route's 'title' key) if available, or from document title. You may override defaults as described below.

Using route data

  1. Configure ngx-matomo-client to read from route data:
import { provideMatomo, withRouter, withRouteData } from 'ngx-matomo-client';

await bootstrapApplication(RootComponent, {
  providers: [
    provideMatomo(
      {
        /* ... */
      },
      withRouter(),
      withRouteData(), // Add this feature
    ),
  ],
});

By default, Matomo properties are looked-up at matomo key of Angular route data. You may define another key by providing it as an argument to withRouteData:

// provideMatomo()
withRouteData('myCustomKey');

// Route data:
const routes: Routes = [
  {
    path: 'hello',
    component: HelloComponent,
    data: {
      myCustomKey: {
        ecommerce: {
          productSKU: '12345',
        },
      } as MatomoRouteData,
    },
  },
];
<summary>See equivalent configuration with @NgModule</summary>
import { MatomoModule, MatomoRouterModule, MatomoRouteDataInterceptor } from 'ngx-matomo-client';

@NgModule({
  imports: [
    MatomoModule.forRoot({
      /* ... */
    }),
    MatomoRouterModule.forRoot({
      interceptors: [MatomoRouteDataInterceptor], // Add this configuration
    }),
  ],
  providers: [
    // Optionally, define another key to look-up at:
    {
      provide: MATOMO_ROUTE_DATA_KEY,
      useValue: 'myCustomKey',
    },
  ],
})
export class AppModule {}
  1. Then, declare route data under matomo key:
import { MatomoRouteData } from './route-data-interceptor';

const routes: Routes = [
  {
    path: '',
    component: HomeComponent,
    title: 'My home page', // <-- Matomo will use this title by default, if available
    data: {
      matomo: {
        title: 'My home page title for Matomo', // <-- You can override the title sent to Matomo
      } as MatomoRouteData,
    },
  },
  {
    path: 'hello',
    component: HelloComponent,
    title: 'My home page', // <-- Matomo will use this title if available
    data: {
      matomo: {
        ecommerce: {
          productSKU: '12345',
          productName: 'French baguette',
        },
      } as MatomoRouteData,
    },
  },

  // Data can also be retrieve asynchronously using 'resolve':
  {
    path: ':productId',
    component: ProductComponent,
    resolve: {
      matomo: async (route: ActivatedRouteSnapshot): Promise<MatomoRouteData> => {
        // Load any asynchronous data
        const product = await inject(MyProductService).loadProductData(route.params.productId);

        return {
          ecommerce: {
            productSKU: product.sku,
          },
        };
      },
    },
  },
];

Following properties are available:

Property Type
title string
ecommerce.productSKU string
ecommerce.productName string
ecommerce.productCategory string
ecommerce.price number
ecommerce.quantity number

Using custom interceptor

If you need custom logic to extract data, define a custom interceptor implementation. An interceptor may be either a function or a class:

import {
  MatomoRouterInterceptor,
  MatomoRouterInterceptorFn,
  MatomoRouteInterceptorBase,
} from 'ngx-matomo-client';

/** A simple functional interceptor */
const myInterceptorFn: MatomoRouterInterceptorFn = (event: NavigationEnd) => {
  const tracker = inject(MatomoTracker);

  tracker.setDocumentTitle('My title');
  tracker.setEcommerceView(/* ... */);
};

/** A class interceptor must implement `MatomoRouterInterceptor` */
@Injectable()
export class MySimpleInterceptor implements MatomoRouterInterceptor {
  private readonly tracker = inject(MatomoTracker);

  beforePageTrack(event: NavigationEnd): void {
    this.tracker.setDocumentTitle('My title');
    this.tracker.setEcommerceView(/* ... */);
  }
}

/**
 * For interceptors that need access to ActivatedRouteSnapshot, you may extend
 * `MatomoRouteInterceptorBase` built-in class.
 */
@Injectable()
export class MyAsyncInterceptor extends MatomoRouteInterceptorBase<string> {
  private readonly tracker = inject(MatomoTracker);

  protected extractRouteData(route: ActivatedRouteSnapshot): string {
    return route.paramMap.get('productId');
  }

  protected async processRouteData(productId: string): Promise<void> {
    const product = await this.loadProductData(productId);

    this.tracker.setEcommerceView(productId, product.name);
  }
}

And provide it in your application:

import { withRouterInterceptors, MatomoRouterInterceptor } from 'ngx-matomo-client';

await bootstrapApplication(RootComponent, {
  providers: [
    provideMatomo(
      {
        /* ... */
      },
      withRouter(),

      // Add interceptors here:
      withRouterInterceptors([myInterceptorFn, MySimpleInterceptor, MyAsyncInterceptor]),
    ),
  ],
});
<summary>See equivalent configuration with @NgModule</summary>
@NgModule({
  imports: [
    MatomoModule.forRoot({
      /* ... */
    }),
    MatomoRouterModule.forRoot({
      // Add interceptors here:
      interceptors: [myInterceptorFn, MySimpleInterceptor, MyAsyncInterceptor],
    }),
  ],
})
export class AppModule {}

Tracking events

You can track click events in templates using [matomoClickAction] directive:

<button
  type="button"
  matomoClickCategory="myCategory"
  matomoClickAction="myAction"
  matomoClickName="myName"
  [matomoClickValue]="42"
>
  Example for tracking button clicks
</button>
<!-- Inputs [matomoClickName] and [matomoClickValue] are optional -->

You can also track any kind of events using [matomoTracker] directive:

<!-- Tracking "change" event on an input -->
<input
  type="text"
  matomoTracker="change"
  matomoCategory="myCategory"
  matomoAction="myAction"
  matomoName="myName"
  [matomoValue]="myValue"
/>

<!-- Tracking multiple events -->
<input
  type="text"
  [matomoTracker]="['focus', 'blur']"
  matomoCategory="myCategory"
  matomoAction="myAction"
  matomoName="myName"
/>

<!-- For advanced usage, you may export directive as a variable and call its 'trackEvent()' method -->
<input
  type="text"
  matomoTracker
  #tracker="matomo"
  matomoCategory="myCategory"
  matomoAction="myAction"
  matomoName="myName"
  [matomoValue]="myValue"
  (change)="tracker.trackEvent()"
/>

<!-- You may also set default values and overwrite them in method call -->
<input
  type="text"
  matomoTracker
  #tracker="matomo"
  matomoCategory="myCategory"
  matomoAction="myAction"
  (focus)="tracker.trackEvent('focus')"
  (blur)="tracker.trackEvent('blur')"
/>

Note for standalone components users: all ngx-matomo-client components and directives are standalone and can be imported where you need them. You may also want to import all of them at once using `MATOMODIRECTIVES`._

Matomo supports multiple options to allow requiring user consent for tracking.

To identify whether you need to ask for any consent, you need to determine whether your lawful basis for processing personal data is "Consent" or "Legitimate interest", or whether you can avoid collecting personal data altogether.

Do not track

Do not track feature is supported, just set acceptDoNotTrack configuration option.

Please note that do-not-track setting is also configured server-side! You should likely set this setting here to match your server-side configuration. In case users opt-in for do-not-track:

  • If set to true here, users will not be tracked, independently of you server-side setting.
  • If set to false here (the default), users will be tracked depending on your server setting, but tracking requests and cookies will still be created!

See official guide

By default, no consent is required. To manage consent opt-in, first set dedicated configuration option requireConsent to either 'cookie' or 'tracking':

  • In the context of tracking consent no cookies will be used and no tracking request will be sent unless consent was given. As soon as consent was given, tracking requests will be sent and cookies will be used.
  • In the context of cookie consent tracking requests will be always sent. However, cookies will be only used if consent for storing and using cookies was given by the user.

See official guide

For integration with a consent opt-in form, you may want to use following MatomoTracker methods:

  • isConsentRequired()
  • setConsentGiven() / setCookieConsentGiven()
  • rememberConsentGiven(hoursToExpire?: number) / rememberCookieConsentGiven(hoursToExpire?: number)
  • forgetConsentGiven() / forgetCookieConsentGiven()
  • hasRememberedConsent() / areCookiesEnabled()
  • getRememberedConsent() / getRememberedCookieConsent()

See also example below on how to create a consent form. Example below is about creating an opt-out form, but it may be easily adapted using methods listed above.

To manage consent opt-out, use dedicated methods MatomoTracker.optUserOut() and MatomoTracker.forgetUserOptOut().

A (very) simple form is provided through <matomo-opt-out-form> component.

For more advanced integration with a custom form, you may want to define your own component and use MatomoTracker methods:

<p>To opt-out, please activate the checkbox below to receive an opt-out cookie.</p>
<p>
  <label>
    <input type="checkbox" [ngModel]="optedOut$ | async" (ngModelChange)="handleChange($event)" />
    <ng-container *ngIf="optedOut$ | async; else: optedIn">
      You are currently opted out. Click here to opt in.
    </ng-container>
    <ng-template #optedIn>You are currently opted in. Click here to opt out.</ng-template>
  </label>
</p>
@Component({
  selector: 'my-opt-out-form',
  templateUrl: '...',
})
export class MatomoOptOutFormComponent {
  optedOut$: Promise<boolean>;

  constructor(private readonly tracker: MatomoTracker) {
    this.optedOut$ = tracker.isUserOptedOut();
  }

  handleChange(optOut: boolean) {
    if (optOut) {
      this.tracker.optUserOut();
    } else {
      this.tracker.forgetUserOptOut();
    }

    this.optedOut$ = this.tracker.isUserOptedOut();
  }
}

This example is adapted from official guide about how to create a custom opt-out form

Tracker API

All Matomo tracking features are available through MatomoTracker service. Please refer to Matomo documentation for details.

import { Component, inject } from '@angular/core';
import { MatomoTracker } from 'ngx-matomo-client';

@Component({
  /* ... */
})
export class ExampleComponent {
  private readonly tracker = inject(MatomoTracker);

  myMethod() {
    // Example of using e-commerce features:
    this.tracker.setEcommerceView('product-SKU', 'My product name', 'Product category', 999);
    this.tracker.addEcommerceItem('product-SKU');
    this.tracker.trackEcommerceCartUpdate(999);
    this.tracker.trackEcommerceOrder('order-id', 999);

    // ... many more methods are available
  }
}

Please note that most features (such as setEcommerceView) must be called before trackPageView! You may want to take a look at how to use interceptors.

Plugins

Form analytics

Form Analytics support is currently experimental. Please report any bugs, and pull requests are highly appreciated!

Configuration

Form analytics plugin is supported out-of-the-box. Add withFormAnalytics() feature to provideMatomo():

import { withFormAnalytics } from 'ngx-matomo-client/form-analytics';

await bootstrapApplication(RootComponent, {
  providers: [
    provideMatomo(
      {}, // Your base configuration
      withFormAnalytics(), // Add this feature
    ),
  ],
});
<summary>See equivalent configuration with @NgModule</summary>
import { MatomoFormAnalyticsModule } from 'ngx-matomo-client/form-analytics';

@NgModule({
  imports: [
    NgxMatomoModule.forRoot({
      /* ... */
    }),
    MatomoFormAnalyticsModule,
  ],
})
export class AppModule {}

Usage

Matomo client will automatically scan for forms in your pages after each page tracking.

If some forms are dynamically added in your components on another timing, you can use matomoTrackForm or matomoTrackForms directives to track them:

<!-- Adding matomoTrackForm directive will ensure the form is always tracked -->
<form id="myForm" matomoTrackForm></form>

If the content of your form is dynamic, and you want to correctly track inner form controls, you will have to rescan the form after changes:

<form id="myForm" matomoTrackForm>
  <!-- Add matomoTrackFormField directive to ensure the form is tracked -->
  <input *ngIf="condition" matomoTrackFormField />
</form>

If a container is dynamically toggled, you can track multiple descendant forms at once by using matomoTrackForms (note the final s) on the container:

<div *ngIf="showFormsCondition" matomoTrackForms>
  <form id="myForm1">...</form>
  <form id="myForm2">...</form>
</div>

To automatically track a form submit when an element is clicked (for example a non-submit button), add matomoTrackFormSubmit on the button:

<form id="myForm" matomoTrackForm>
  <button type="button" matomoTrackFormSubmit>Non-native submit</button>
</form>

You can also inject MatomoFormAnalytics service in your components and use low-level api directly.

See official guide at https://developer.matomo.org/guides/form-analytics.

Migration from @ngx-matomo/tracker and @ngx-matomo/router (version <= 4)

Starting from version 5, this library is distributed as a single package named ngx-matomo-client instead of @ngx-matomo/tracker and @ngx-matomo/router.

Run ng add ngx-matomo-client to migrate your code automatically.

To manually migrate your code:

  1. In your package.json, replace @ngx-matomo/tracker dependency with ngx-matomo-client
  2. In your package.json, remove @ngx-matomo/router dependency
  3. Replace all imports from @ngx-matomo/tracker or @ngx-matomo/router with imports from ngx-matomo-client instead.

Also, feel free to use the new NgModule-free way of providing ngx-matomo-client using provideMatomo() function instead of importing NgxMatomoModule and NgxMatomoRouterModule.

Configuration reference

Find all options and features here

FAQ

How to use ngx-matomo-client without @angular/router?

If you don't have @angular/router in your application, you will encounter errors when declaring imports from ngx-matomo-client.

Instead, you must use imports from ngx-matomo-client/core.

This is because ngx-matomo-client is composed of two entry points:

  • ngx-matomo-client/core which contains core features and doesn't depend on @angular/router
  • ngx-matomo-client/router which brings router features and depends on @angular/router

For backward compatibility reasons, the global entrypoint ngx-matomo-client is a shorthand that re-exports both of them (thus depending on @angular/router).

How to set page title?

If automatic page view tracking is enabled, then you probably have nothing to do: the page title will be detected and sent to Matomo.

  • Customizing page title by setting title property of Angular route config is natively supported. See Angular tutorial here: Setting the page title. Please note this will not work if you set Matomo router delay option to -1.
  • For more complex logic, you may also define an interceptor that will call tracker.setDocumentTitle(title). See dedicated section.

If you're not using automatic page view tracking, then you should manually call tracker.setDocumentTitle(title) or tracker.trackPageView(title).

Should I include the tracking code provided by Matomo?

No, by default ngx-matomo-client includes Matomo's tracking script for you, so you don't need to copy/paste the tracking code into your application.

If you are not using the default configuration and set the initialization mode to 'manual', then you must include the tracking code yourself as explained on official guide.

How to disable tracking in some environments?

You may want to disable tracker in dev environments to avoid tracking some unwanted usage: local dev usage, end-to-end tests...

To do so just set the disabled property to true in your main configuration:

await bootstrapApplication(RootComponent, {
  providers: [
    provideMatomo({
      /* ... */
      disabled: !environment.production,
    }),
  ],
});
<summary>See equivalent configuration with @NgModule</summary>
@NgModule({
  imports: [
    MatomoModule.forRoot({
      /* ... */
      disabled: !environment.production,
    }),
  ],
})
export class AppModule {}

How to exclude some routes from tracking

If you are using automatic route tracking and want to ignore some routes, use the exclude option of router configuration:

await bootstrapApplication(RootComponent, {
  providers: [
    provideMatomo(
      {
        /* ... */
      },
      withRouter({
        exclude: [/some-pattern$/],
      }),
    ),
  ],
});
<summary>See equivalent configuration with @NgModule</summary>
@NgModule({
  imports: [
    MatomoModule.forRoot({
      /* ... */
    }),
    MatomoRouterModule.forRoot({
      exclude: [/some-pattern$/],
    }),
  ],
})
export class AppModule {}

How can I customize the inserted script tag?

By default, Matomo's script is injected using a basic script tag looking like <script src="..." defer async type="text/javascript">.

To customize this script tag, define a custom script factory function:

import { createDefaultMatomoScriptElement } from 'ngx-matomo-client';

const myScriptFactory: MatomoScriptFactory = (
  scriptUrl: string,
  document: Document,
): HTMLScriptElement => {
  // Option 1: create using default built-in factory
  const script = createDefaultMatomoScriptElement(scriptUrl, document);

  // Option 2: Manually create a script element
  const script = document.createElement('script');
  script.url = scriptUrl;

  // Customize what you want
  script.setAttribute('data-cookieconsent', 'statistics');

  return script;
};

And provide it to your application:

import { withScriptFactory } from 'ngx-matomo-client';

await bootstrapApplication(RootComponent, {
  providers: [
    provideMatomo(
      {
        /* ... */
      },
      withScriptFactory(myScriptFactory),
    ),
  ],
});
<summary>See equivalent configuration with @NgModule</summary>
import { MATOMO_SCRIPT_FACTORY } from 'ngx-matomo-client';

@NgModule({
  imports: [
    MatomoModule.forRoot({
      /* ... */
    }),
  ],
  providers: [
    {
      provide: MATOMO_SCRIPT_FACTORY,
      useValue: myScriptFactory,
    },
  ],
})
export class AppModule {}

Can I use ngx-matomo-client with Server-side rendering (SSR) / Angular Universal?

Yes. ngx-matomo-client automatically disables itself on non-browser platforms.

Can I use ngx-matomo-client with Tag Manager?

Yes.

In such case, you don't have to set yourself the trackerUrl and siteId. During install with ng add, leave serverUrl and siteId blank and provide a value for scriptUrl.

Your configuration may look like that:

import { withScriptFactory } from 'ngx-matomo-client';

await bootstrapApplication(RootComponent, {
  providers: [
    provideMatomo({
      /* ... */
      scriptUrl: 'YOUR_MATOMO_SCRIPT_URL', // your Matomo's script url
    }),
  ],
});
<summary>See equivalent configuration with @NgModule</summary>
@NgModule({
  imports: [
    MatomoModule({
      /* ... */
      scriptUrl: 'YOUR_MATOMO_SCRIPT_URL', // your Matomo's script url
    }),
  ],
})
export class AppModule {}

How to define configuration asynchronously? (HTTP fetch...)

In some case, you may want to load your trackers configuration asynchronously. To do so, set the configuration mode to 'deferred' and manually call MatomoInitializerService.initializeTracker(config) when you are ready:

await bootstrapApplication(RootComponent, {
  providers: [
    provideMatomo({
      /* ... */
      mode: 'deferred',
    }),

    // Example: use an APP_INITIALIZER
    {
      provide: APP_INITIALIZER,
      useFactory: () => {
        const http = inject(HttpClient);
        const matomoInitializer = inject(MatomoInitializerService);

        return () =>
          http.get('/my-config').pipe(tap(config => matomoInitializer.initializeTracker(config)));
      },
      multi: true,
    },
  ],
});
<summary>See equivalent configuration with @NgModule</summary>
@NgModule({
  imports: [
    MatomoModule.forRoot({
      /* ... */
      mode: 'deferred',
    }),
  ],
  providers: [
    // Example: use an APP_INITIALIZER
    {
      provide: APP_INITIALIZER,
      useFactory: () => {
        const http = inject(HttpClient);
        const matomoInitializer = inject(MatomoInitializerService);

        return () =>
          http.get('/my-config').pipe(tap(config => matomoInitializer.initializeTracker(config)));
      },
      multi: true,
    },
  ],
})
export class AppModule {}

All tracking instructions before initializeTracker will be queued locally and sent only when this method is called. Don't forget to call it!

If you need to asynchronously load more configuration properties, then consider the solution described in this issue instead (which has some drawbacks, such as delaying the whole application startup).

Side note: only the trackers configuration can be deferred, not all configuration properties. This is required because some properties require to be set before any other action is tracked. For example: requireConsent must be set before any other tracking call, trackAppInitialLoad should be set before any navigation occurs.

How can I test my components which uses MatomoTracker or other Matomo features?

Matomo can be easily mocked and tested by declaring either provideMatomoTesting() providers or MatomoTestingModule in TestBed.

All these symbols can be imported from ngx-matomo-client/testing.

Can I use ngx-matomo-client in a zoneless Angular application?

Matomo is fully compatible with zoneless applications out of the box.

Roadmap

See roadmap here

Contributing

See guide here

Launch demo app

  1. Clone this repository
  2. Update matomoSiteId and matomoTrackerUrl in projects/demo/src/environments/environment.ts
  3. Launch the app using npm run demo. This will build and launch the app on http://localhost:4200

Note: if you can't bind to an existing Matomo server, see https://github.com/matomo-org/docker to set-up a local Matomo instance

changelog

7.1.0 (2025-06-10)

Features

  • add new setIgnoreCampaignsForReferrers and getIgnoreCampaignsForReferrers methods to tracker (9da1812)
  • update docs for zoneless applications (be579c7)

7.0.1 (2025-01-15)

Bug Fixes

  • export MATOMO_TESTING_INSTANCE token (81abc32), closes #108

7.0.0 (2025-01-14)

Bug Fixes

  • correctly inject legacy MatomoRouterModule and NgxMatomoRouterModule (c2f7fda), closes #105 #104
  • correctly resolve deferred configuration when using manual initialization mode (f0bb6c1), closes #102
  • prepare testing api update (0471e41)

Features

  • add compatibility with Angular 19 (#101) (bfae2b7), closes #99 #103
  • add new withPageUrlProvider feature and allow functional-style provider (3d002d8)
  • allow providing Matomo in lazy-loaded components/modules (#98) (2982fc4), closes #97
  • allow providing page url as promise (5bb76a4)

Breaking changes

  • Angular v19 is now required as peer dependency
  • Some of your tests may be broken, you may need to provide Matomo in TestBed using provideMatomoTesting().

Deprecations

  • MatomoTestingTracker.setMatomoInstance has been deprecated, provide a MATOMO_TESTING_INSTANCE DI token instead

6.4.1 (2025-01-14)

Reverts

  • feat: allow providing Matomo in lazy-loaded components/modules (#98) (3c20676)
  • fix: correctly resolve deferred configuration when using manual initialization mode (a2ca6c4)

6.4.0 (2025-01-03)

Bug Fixes

  • correctly resolve deferred configuration when using manual initialization mode (da82506), closes #102

Features

  • add getCustomData and setCustomData tracker API methods (e76564c)
  • add optional custom data parameter to event tracking (0cdda40)
  • add optional custom data parameter to goal tracking (6e21b91)
  • add optional custom data parameter to link tracking (cfb42b1)
  • add optional custom data parameter to site search tracking (fa35f1c), closes #96
  • allow providing Matomo in lazy-loaded components/modules (#98) (45a5a0e)

6.3.1 (2024-09-15)

Bug Fixes

  • router, form-analytics: disable page tracking on server (#94) (229083b)

6.3.0 (2024-07-18)

Features

  • core: introduce literal type MatomoConsentRequirement (e517efd)
  • core: introduce literal type MatomoInitializationBehavior (0cac720)
  • router: add functional interceptors support (6002d77)

Deprecations

  • core: MatomoConsentMode enum is deprecated, use MatomoConsentRequirement instead.
  • core: MatomoInitializationMode enum is deprecated, use MatomoInitializationBehavior instead.

6.2.0 (2024-05-28)

Bug Fixes

  • tracker: add default value for acceptDoNotTrack option (243fc46)
  • upgrade schematics to non-deprecated module names (946ef9f)

Features

  • add compatibility with Angular 18 (7828aed), closes #90
  • add FormAnalytics support (ccdcfac)
  • router: allow ignoring subsequent navigation to the same url (#89) (1cb504c), closes #72
  • tracker: add new disableCampaignParameters configuration option (88258fa)
  • tracker: add new disableCampaignParameters tracker method (4cfda65)

6.1.3 (2024-04-09)

Bug Fixes

  • add Injectable decorator to MatomoTestingTracker (#86) (5e651eb), closes #85

6.1.2 (2024-03-31)

Bug Fixes

  • fix GitHub redirection problem after renaming project (13ed0f1)

6.1.1 (2024-03-31)

Bug Fixes

  • release: fix publish problem with 6.1.0 release (f9b9ba2)

6.1.0 (2024-03-31)

Features

  • provide testing implementation (ef5d358)

6.0.2 (2024-01-30)

Bug Fixes

  • router: retrieve Base Href from LocationStrategy and correctly handle nulls (73e8442), closes #82

6.0.1 (2024-01-15)

Bug Fixes

  • router: fix router module constructor token declaration (82e0aa2), closes #79

6.0.0 (2023-11-12)

Bug Fixes

  • MatomoOptOutFormComponent now waits for default server url from possibly deferred configuration (c60b134)

Code Refactoring

  • rename NgxMatomoModule to MatomoModule (eb70405)
  • rename NgxMatomoRouterModule to MatomoRouterModule (8795a05)

Features

  • add setPageViewId and getPageViewId to tracker api (b234a7b)
  • compatibility with Matomo 5 (35ad9e1)
  • upgrade to Angular 17 (9ac9a10)

Breaking changes

  • Angular v17 is now required as peer dependency

Deprecations

  • NgxMatomoRouterModule has been deprecated, use MatomoRouterModule instead
  • NgxMatomoModule has been deprecated, use MatomoModule instead

5.0.4 (2023-09-04)

Bug Fixes

  • README: add missing Angular 15 compatibility statement to compatibility table (182ad2b)

5.0.3 (2023-09-02)

Bug Fixes

  • add secondary entry points (89f9344)

Performance Improvements

5.0.2 (2023-07-25)

Bug Fixes

  • router: fix NgxMatomoRouterModule not being correctly enabled without .forRoot() call (61603b6), closes #68

5.0.1 (2023-07-03)

Bug Fixes

  • README: fix legacy documentation link and images size (ef38fda)

5.0.0 (2023-07-03)

Bug Fixes

  • schematics: correctly remove legacy packages during install (5cc6a8c)
  • tracker: add missing public exports (27973ca)

Code Refactoring

  • merge @ngx-matomo/router into main package (dca634a)
  • rename library to ngx-matomo-client (be8f65e)
  • router: remove MatomoRouteDataInterceptor and MatomoRouteInterceptorBase constructor arguments (5c5086d)
  • router: replace init() method with initialize() for naming consistency (f82c013)
  • tracker: rename NgxMatomoTrackerModule to NgxMatomoModule (96c8f2e)

Features

  • add new NgModule-free providers (2dbe82d)
  • router: allow custom key for route data lookup (936176d)
  • schematics: support new providers-style setup (057223a)
  • tracker, router: add support for pseudo-clicks with enableLinkTracking config property (641a255)
  • tracker: add disableBrowserFeatureDetection and enableBrowserFeatureDetection methods (d462941)
  • tracker: add getExcludedReferrers and setExcludedReferrers methods (b725de8)
  • tracker: add getRememberedCookieConsent method (7504381)
  • tracker: add public export for MATOMO_DIRECTIVES (f0362e9)
  • tracker: allow inject calls in script factory (bb2aae0)
  • tracker: allow route tracking customization using route data (480f30e)
  • tracker: automatically enable or disable initial page view tracking (eeccb3e)
  • tracker: make Matomo directives standalone (27c2ecc)

Breaking changes

  • tracker: Configuration option trackAppInitialLoad is now true by default, unless router feature is enabled (it previously was always false by default). For applications with router enabled, nothing changes. It can still be manually configured like before. This should not affect most applications, because tracking initial page view is not recommended when router feature is enabled.
  • router: MatomoRouteDataInterceptor and MatomoRouteInterceptorBase constructors are now argument-less. They now require to be instantiated in an injection context instead.
  • tracker, router: enableLinkTracking now don't enable pseudo-click tracking by default after each page view. This is consistent with the default Matomo behavior. To restore previous behavior, set enableLinkTracking configuration property to 'enable-pseudo'.
  • Library's npm package has been renamed to ngx-matomo-client. Legacy packages should not be used anymore: please migrate all imports from @ngx-matomo/tracker and @ngx-matomo/router to ngx-matomo-client instead.
  • Package @ngx-matomo/router is no longer necessary. It should be removed from your project.
    • NgxMatomoRouterModule is now available from the main library package
    • All your imports should be migrated and imported from the main library package

Deprecations

  • router: Method MatomoRouter.init() has been deprecated, use MatomoRouter.initialize() instead
  • tracker: NgxMatomoTrackerModule is deprecated, use NgxMatomoModule instead

4.1.0 (2023-05-03)

Bug Fixes

  • tracker: perform initialization checks earlier to prevent running pre-init tasks multiple times (771e24d)

Features

  • add Angular 16 support (c40cca8)
  • tracker: add new method to enable file tracking (b595d99)
  • tracker: add performance timings getter (fc0674d)

4.0.1 (2022-11-25)

Bug Fixes

  • tracker: add the option to run tracking outside of angular zone (6d26eac), closes #60

4.0.0 (2022-11-24)

Features

Breaking changes

  • Angular version 15 is now required as a peer dependency

3.2.0 (2022-07-26)

Bug Fixes

  • tracker: add missing generic parameter constraint (5c1e4e8)
  • tracker: add missing symbol to public api (eb79fc0)
  • tracker: fix custom script factory provider (c31342b), closes #56

Features

  • tracker: add setPagePerformanceTiming tracking method (4e92fe7)

3.1.0 (2022-07-22)

Bug Fixes

  • tracker: prevent initializing Matomo more than once (784b1de)

Code Refactoring

  • tracker: replace init() method with initialized() for naming consistency (8e23baf)

Features

  • tracker: allow deferred trackers configuration (cd51156), closes #31 #54

Deprecations

  • tracker: Method MatomoInitializerService.init() has been deprecated. Use MatomoInitializerService.initialize() instead.

3.0.0 (2022-06-08)

Features

Breaking changes

  • Angular version 14 is now required as a peer dependency

2.4.2 (2022-05-03)

Bug Fixes

  • tracker: add enableJSErrorTracking as configuration option (1586d78)
  • tracker: add enableJSErrorTracking tracker method (68136d5), closes #37

2.4.1 (2022-03-31)

Bug Fixes

  • router: use correct rxjs import path (fe15b20), closes #42

2.4.0 (2022-03-16)

Bug Fixes

  • router: check for invalid interceptors config (0b6686d)
  • router: correctly queue concurrent tracking calls (54882b4), closes #33
  • router: export missing public api symbol (d77aba0)
  • router: simplify interceptors config (ce407dd), closes #12
  • schematics: use correct version in schematics (d0c7667)
  • tracker: allow tracking ecommerce category page (9e14ca5), closes #34
  • tracker: make ecommerce parameters optional (382f5dc)

Documentation

  • router: deprecate PageTitleProvider and MATOMO_PAGE_TITLE_PROVIDER (61db04a)

Features

  • router: add built-in route data interceptor (dfd9409), closes #12
  • router: provide base implementation for interceptors depending on ActivatedRoute (39904e7), closes #12
  • tracker: add support for pre-defined tracker (ee9364d), closes #32

Deprecations

  • router: Interface PageTitleProvider and injection token MATOMO_PAGE_TITLE_PROVIDER are now deprecated. Use MatomoRouterInterceptor instead, for example declared in NgxMatomoRouterModule.forRoot(). See documentation for details on how to configure interceptors.

2.4.0-next.3 (2022-03-16)

Bug Fixes

  • router: correctly queue concurrent tracking calls (54882b4), closes #33

Documentation

  • router: deprecate PageTitleProvider and MATOMO_PAGE_TITLE_PROVIDER (61db04a)

Features

  • tracker: add support for pre-defined tracker (ee9364d), closes #32

Deprecations

  • router: Interface PageTitleProvider and injection token MATOMO_PAGE_TITLE_PROVIDER are now deprecated. Use MatomoRouterInterceptor instead, for example declared in NgxMatomoRouterModule.forRoot(). See documentation for details on how to configure interceptors.

2.4.0-next.2 (2022-03-16)

Bug Fixes

  • schematics: use correct version in schematics (d0c7667)

2.4.0-next.1 (2022-03-16)

Bug Fixes

  • router: check for invalid interceptors config (0b6686d)
  • router: export missing public api symbol (d77aba0)
  • router: simplify interceptors config (ce407dd), closes #12
  • tracker: allow tracking ecommerce category page (9e14ca5), closes #34
  • tracker: make ecommerce parameters optional (382f5dc)

Features

  • router: add built-in route data interceptor (dfd9409), closes #12
  • router: provide base implementation for interceptors depending on ActivatedRoute (39904e7), closes #12

2.3.0 (2022-02-28)

Bug Fixes

  • tracker: expose missing types as public api (52501ee)
  • add missing ng-update package-group (e186300)

Features

  • router: add router interceptor api (9ca105c)

2.2.1 (2022-01-28)

Bug Fixes

2.2.0 (2022-01-16)

Bug Fixes

  • auto-disable tracker on non-browser platforms (4547bf9), closes #23

Features

  • add support for custom script tags (1586af4), closes #22

2.1.0 (2021-11-29)

Features

2.0.0 (2021-11-22)

Bug Fixes

  • tracker: remove tracker initialization check (8cc72c8)

Features

BREAKING CHANGES

  • Angular version 13 is now required as peer dependency

2.0.0-next.2 (2021-11-14)

Bug Fixes

  • tracker: remove tracker initialization check (8cc72c8)

2.0.0-next.1 (2021-11-13)

Features

BREAKING CHANGES

  • Angular version 13 is now required as peer dependency

1.3.3 (2021-09-10)

Bug Fixes

  • tracker: lazily check tracker initialization (c3250ba), closes #15

1.3.2 (2021-07-20)

Bug Fixes

  • tracker: allow auto link tracking without tracking initial page view (df13f9f), closes #11

1.3.1 (2021-06-25)

Bug Fixes

  • tracker: fix opt-out form parameters encoding (f160199), closes #9

1.3.0 (2021-06-09)

Bug Fixes

  • tracker: add missing configuration property documentation to README (4b4ba6c)
  • tracker: fix initial page load track not respecting do-not-track setting (6f6d0ff)
  • tracker: fix scope parameter type (6d57154)
  • tracker: fix setSiteId parameter type (a1cdd9d)
  • tracker: fix test case (7c5a8cd)
  • tracker: fix test name (b0b2227)

Features

  • tracker: add addTracker method (b72b989)
  • tracker: add configuration option for DoNotTrack (2166ee2)
  • tracker: add disablePerformanceTracking method (973966e)
  • tracker: add methods to enable/disable sendBeacon (2a69ff5)
  • tracker: add missing cross-domain linking parameter getter (ed4b7e6)
  • tracker: add missing ecommerce methods (317812e)
  • tracker: add missing ping function (3c9bdfd)
  • tracker: add missing queue request functions (75a9df8)
  • tracker: add opt-out form component (c2a03b5)
  • tracker: add setCookieSameSite method (a27f8d6)
  • tracker: add setVisitorId method (3c18822)
  • tracker: add support for lazy-loaded modules (f958a9d), closes #7
  • tracker: add tracking-consent support (4f426a2)
  • tracker: set default value of enableLinkTracking parameter to false (56578a6)

1.3.0-next.5 (2021-06-09)

Bug Fixes

1.3.0-next.4 (2021-06-09)

Features

  • tracker: add support for lazy-loaded modules (f958a9d), closes #7

1.3.0-next.3 (2021-06-08)

Bug Fixes

  • tracker: add missing configuration property documentation to README (4b4ba6c)
  • tracker: fix initial page load track not respecting do-not-track setting (6f6d0ff)
  • tracker: fix setSiteId parameter type (a1cdd9d)

Features

  • tracker: add addTracker method (b72b989)
  • tracker: add opt-out form component (c2a03b5)
  • tracker: add tracking-consent support (4f426a2)

1.3.0-next.2 (2021-06-01)

Bug Fixes

  • tracker: fix scope parameter type (6d57154)

Features

  • tracker: add configuration option for DoNotTrack (2166ee2)
  • tracker: add disablePerformanceTracking method (973966e)
  • tracker: add missing cross-domain linking parameter getter (ed4b7e6)
  • tracker: add missing ping function (3c9bdfd)
  • tracker: add missing queue request functions (75a9df8)
  • tracker: add setCookieSameSite method (a27f8d6)
  • tracker: add setVisitorId method (3c18822)
  • tracker: set default value of enableLinkTracking parameter to false (56578a6)

1.3.0-next.1 (2021-06-01)

Bug Fixes

Features

  • tracker: add methods to enable/disable sendBeacon (2a69ff5)
  • tracker: add missing ecommerce methods (317812e)

1.2.0 (2021-05-27)

Features

  • tracker: add option to disable tracking (900c617), closes #3

Performance Improvements

  • router: avoid unnecessary subscription if disabled (23cc580)

1.1.0 (2021-05-25)

Features

1.1.0-next.1 (2021-05-25)

Features

1.0.3 (2021-05-05)

Bug Fixes

  • packaging: fix peer dependency (2c727c4)

1.0.3-beta.1 (2021-05-02)

Bug Fixes

  • packaging: fix peer dependency (2c727c4)

1.0.2 (2021-05-02)

Bug Fixes

  • demo: translate text into english (17ba193)

1.0.1 (2021-05-01)

Bug Fixes

  • packaging: add npm package metadata (64e7074)

1.0.0 (2021-05-01)

Features

  • initiate project (e521701)
  • semantic-release: add library dist tags (54f1a03)