Error: Uncaught (in promise): TypeError: Cannot read property 'pushTag' of undefined

Question

I am trying to integrate google tag manager but after configuration it is giving pushTag of undefined.

These are the snippets

home.component.ts

 import { Component, OnInit, OnDestroy, ViewChild, AfterViewInit, Input } from '@angular/core'; import { Router, ActivatedRoute, NavigationEnd } from '@angular/router'; import { MatSnackBar } from '@angular/material/snack-bar'; import { CounterService } from './counter.service'; import { NotificationService } from '../services/notification.service'; import { MatBottomSheet, MatBottomSheetRef } from '@angular/material/bottom-sheet'; import { GoogleTagManagerService } from 'angular-google-tag-manager'; @Component({ selector: 'app-home', templateUrl: './home.component.html', styleUrls: ['./home.component.scss'] }) export class HomeComponent implements OnInit, OnDestroy { constructor( private gtmService: GoogleTagManagerService, ) {} ngOnInit() { this.router.events.forEach(item => { if (item instanceof NavigationEnd) { const gtmTag = { event: 'page', pageName: item.url }; this.gtmService.pushTag(gtmTag); } }); }

home.module.ts

 import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { HomeRoutingModule } from './home-routing.module'; import { HomeComponent, BottomSheetOverviewExampleSheet } from './home.component'; import { SharedModule } from '../shared/shared.module'; import { MaterialModule } from '../material.module'; import { CarouselModule } from 'ngx-owl-carousel-o'; @NgModule({ declarations: [HomeComponent,BottomSheetOverviewExampleSheet], imports: [ CommonModule, HomeRoutingModule, SharedModule, CarouselModule, MaterialModule, ], entryComponents: [BottomSheetOverviewExampleSheet], providers: [ {provide: 'googleTagManagerId', useValue: '*****'} ], }) export class HomeModule { }

Answer 1

Please provide your GTM id in app.module.ts and not in home.module.ts.

Hope this helps.

@NgModule({
    ...
    providers: [
        {provide: 'googleTagManagerId', useValue: '*****'}
    ],
})
export class AppModule { }