Wrong documentation? about angular-google-tag-manager HOT 10 CLOSED

Maybe I have to excuse myself. I'm tottally new to GTM and noticed, that I haven't set a stream yet. After doing so and adding appropriate domains I can see something in the live view. So it seems to work. I'm waiting for 24hrs and then will close this issue, if everything works.

from angular-google-tag-manager.

Unless you want to execute some code after the event pusth to GTM you don't need to await the pushTag promise,
the pushed event will be registered by google asynchronously.
I think there is some misconfiguration in your code , the local datalayer variable is polupated with your events?

from angular-google-tag-manager.

I've exactly followed the documentation. What do you mean with "local datalayer variable is populated"?

Code looks like that (for debugging):

private registerGoogleTagManager(): void {
    if (!environment.production) return;
    
    this.router.events.forEach((state) => {
      if (state instanceof NavigationEnd) {
        const tag = {
          event: 'page',
          pageName: state.url,
        };

        this.googleTagManager.pushTag(tag)
        .then(() => console.log('pushing'))
        .catch(reason => console.warn(reason));
      }
    });
  }

Before it looked like that:

private registerGoogleTagManager(): void {
    if (!environment.production) return;

    this.router.events.forEach((state) => {
      if (state instanceof NavigationEnd) {
        const tag = {
          event: 'page',
          pageName: state.url,
        };

        this.googleTagManager.pushTag(tag);
      }
    });
  }

'pushing' is logged, but I don't see any network traffic in Network tab in F12 developer tools and nothing on Google site as well. Only traffic is gtm.js?id=[GTM_ID]

from angular-google-tag-manager.

take a look to the "Test your tags and data layer" in the documentation article, there isa a section titled "Inspect the dataLayer variable"
if your event is not in the datalayer array i thing GTM not configured correctly

another thing you can try is to send a custom event an see if that is logged on datalayer/GTM

from angular-google-tag-manager.

Ok, I haven't seen the documentation on your site. Maybe you should add these information to README as well.
However; I cannot see the data layer in console. Do I have to activate something or is it used by default? Will try Chrome with extension next.

from angular-google-tag-manager.

Ok, from Google Tag Assistant I'm receiving a notification that it cannot find any debuggable Google tag. Is it possible this happens because it's not SSR currently?

from angular-google-tag-manager.

ok think the problem in the setup, and the library is currently deleloped without SSR

from angular-google-tag-manager.

Ok, let's see.

In my AppModule I import GoogleTagManagerModule.forRoot({id: 'G-XXXXXXXXXX'}),

Then in my code I inject private googleTagManager: GoogleTagManagerService and use it like that:

private registerGoogleTagManager(): void {
    let event: string;

    if (this.isProduction) event = 'page';
    else if (this.isBeta) event = 'page-beta';
    else event = 'page-dev';

    this.router.events.forEach((state) => {
      if (state instanceof NavigationEnd) {
        const tag = {
          event: event,
          pageName: state.url,
        };

        this.googleTagManager.pushTag(tag);
      }
    });
  }

That's all. What am I doing wrong?

from angular-google-tag-manager.

If I change it:

if (state instanceof NavigationEnd) {
  console.log('Start tagging');
  const tag = {
    event: event,
    pageName: state.url,
  };

  this.googleTagManager.pushTag(tag);
  console.log(this.googleTagManager.getDataLayer());
}

I'm getting the dataLayer content:

[
    {
        "gtm.start": 1666714309535,
        "event": "gtm.js",
        "gtm.uniqueEventId": 1
    },
    {
        "event": "page-dev",
        "pageName": "/",
        "gtm.uniqueEventId": 2
    },
    {
        "event": "gtm.dom",
        "gtm.uniqueEventId": 3
    },
    {
        "event": "gtm.load",
        "gtm.uniqueEventId": 4
    }
]

from angular-google-tag-manager.

On navigation it's updating fine:

[
    {
        "gtm.start": 1666714309535,
        "event": "gtm.js",
        "gtm.uniqueEventId": 1
    },
    {
        "event": "page-dev",
        "pageName": "/",
        "gtm.uniqueEventId": 2
    },
    {
        "event": "gtm.dom",
        "gtm.uniqueEventId": 3
    },
    {
        "event": "gtm.load",
        "gtm.uniqueEventId": 4
    },
    {
        "event": "page-dev",
        "pageName": "/was-wir-tun",
        "gtm.uniqueEventId": 5
    }
]

from angular-google-tag-manager.