angulartics2 custom events are sent to facebook but not to google analytics

Question

angulartics2 custom events are sent to facebook but not to google analytics

921 views Asked by ufk At 14 September 2024 at 23:27

I use angulartics2 with an angular7 project to fire events to facebook and google analytics.

I have facebook and google analytics configured using google tag manager.

the problem is my custom events are fired and sent to facebook but not to google analytics.

below the <head> tag I have the google tag manager code.

in the main component typescript file I added the following code:

constructor(
  private angulartics2GoogleTagManager: Angulartics2GoogleTagManager,
  private angulartics2Facebook: Angulartics2Facebook,
  private angulartics2GoogleAnalytics: Angulartics2GoogleAnalytics
            ) {
    this.angulartics2Facebook.startTracking();
    this.angulartics2GoogleTagManager.startTracking();
    this.angulartics2GoogleAnalytics.startTracking();
...

for example when people add items to cart I want to fire an event about it.

so in my cart service I inject angulartics2 in the constructor:

 constructor(@Inject(LOCAL_STORAGE) private storage: StorageService,
                private angulartics2: Angulartics2
                )

and then where it's relevant I fire the event with the following code:

    this.angulartics2.eventTrack.next({action: 'addToCart', properties: {category: 'Cart', label: keyName, value: quantity}});

using facebook pixel chrome extension I can see that the custom event is detected, using google events chrome extension I can see that no event is detected.

what am I missing? what I didn't configure properly?

google analytics is configured properly in google tag manager, I do see users count and page views count properly.

any information regarding this issue would be greatly appreciated.

thanks

update

some more investigation information thanks to @XTOTHEL.

so in the app.component.ts constructor I only enabled google tag manager to start tracking.

unfortunately google tag manager is not detecting any events being fired.

attached a screenshot of google tag manager console after adding stuff to the cart and the angulartics2 code of adding addToCart custom event being fired.

update 2

Original Q&A

There are 1 answers

**Chema** · Answer 1 · 2020-01-07 22:41:16

I don't know if this is what you are looking for, but I got some GTM events with pushLayer method from Angulartics2GoogleTagManager, from within a Service which extends on Angulartics2GoogleTagManager:

@Injectable()
export class GoogleTagManagerService extends Angulartics2GoogleTagManager {

  public gtmProperties: GoogleTagManagerProperties = new GoogleTagManagerProperties();

  pageTrack(path: string) {
    if (typeof dataLayer !== 'undefined' && dataLayer) {
      dataLayer.push({
        event: 'pageView',
        action: path,
        'content-name': path,
        userId: this.angulartics2.settings.gtm.userId,
        ...this.gtmProperties
      });
    }
    return true;
  }

  setSearchCriteria(type: string, criteria) {
    this.pushLayer(type.toLowerCase().indexOf('listings') > -1 ?
      {
        event: 'search',
        action: type,
        'content-name': type,
        userId: this.angulartics2.settings.gtm.userId,
        searchCriteriaListings: criteria
      } : {
        event: 'search',
        action: type,
        'content-name': type,
        userId: this.angulartics2.settings.gtm.userId,
        searchCriteriaPostings: criteria
      });
  }

}

which would bring me a new dataLayer with information like this:

TechQA.

angulartics2 custom events are sent to facebook but not to google analytics

update

update 2

There are 1 answers

Related Questions in ANGULAR

Related Questions in GOOGLE-ANALYTICS

Related Questions in GOOGLE-TAG-MANAGER

Related Questions in ANGULARTICS2

Popular Questions

Popular Tags

Trending Questions