mzuccaroli / angular-google-tag-manager

A service library for integrate google tag manager in your angular project
https://itnext.io/how-to-add-google-tag-manager-to-an-angular-application-fc68624386e2
MIT License
136 stars 78 forks source link

googleTagManagerConfiguration.set is not a function #199

Open HarieswaranD opened 2 weeks ago

HarieswaranD commented 2 weeks ago

I have below configuration in app.config.ts. I am using Angular 17 with standalone components.

import { APP_INITIALIZER, ApplicationConfig } from '@angular/core';
import { provideRouter } from '@angular/router';

import { routes } from './app.routes';
import { GoogleTagManagerConfiguration, GoogleTagManagerService } from 'angular-google-tag-manager';
import { environment } from 'environments/environment';
import { HttpBackend, provideHttpClient } from '@angular/common/http';

export const appConfig: ApplicationConfig = {
  providers: [
    provideRouter(routes),
    provideHttpClient(),
    {
      provide: APP_INITIALIZER,
      useFactory: (googleTagManagerConfiguration: GoogleTagManagerConfiguration) => {
        return () => {
          googleTagManagerConfiguration.set({
            id: environment.gtm.id,
            gtm_auth: environment.gtm.gtm_auth,
            gtm_preview: environment.gtm.gtm_preview,
            gtm_cookies_win: environment.gtm.gtm_cookies_win,
          });
        };
      },
      deps: [HttpBackend, GoogleTagManagerConfiguration],
      multi: true,
    },
  ],
};

I am getting the below error

ERROR TypeError: googleTagManagerConfiguration.set is not a function
    useFactory app.config.ts:17
    Angular 11
    <anonymous> main.ts:5
JanKru commented 2 days ago
import { APP_INITIALIZER, ApplicationConfig } from '@angular/core';
import { provideRouter } from '@angular/router';
import { routes } from './app.routes';
import { GoogleTagManagerConfiguration, GoogleTagManagerService } from 'angular-google-tag-manager';
import { environment } from 'environments/environment';
import { HttpBackend, provideHttpClient } from '@angular/common/http';

export const appConfig: ApplicationConfig = {
  providers: [
    provideRouter(routes),
    provideHttpClient(),
    {
      provide: APP_INITIALIZER,
      useFactory: (googleTagManagerConfiguration: GoogleTagManagerConfiguration) => {
        return () => {
          googleTagManagerConfiguration.set({
            id: environment.gtm.id,
            gtm_auth: environment.gtm.gtm_auth,
            gtm_preview: environment.gtm.gtm_preview,
            gtm_cookies_win: environment.gtm.gtm_cookies_win,
          });
        };
      },
      deps: [GoogleTagManagerConfiguration, HttpBackend],
      multi: true,
    },
  ],
};