错误:未捕获(承诺):TypeError:无法读取未定义的属性“ pushTag”

时间:2020-05-21 08:29:49

标签: angular google-tag-manager

我正在尝试集成google标记管理器,但配置后会给出未定义的pushTag。

这些是片段

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 { }

1 个答案:

答案 0 :(得分:1)

请在app.module.ts中而不是home.module.ts中提供您的GTM ID。

希望这会有所帮助。

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