NullInjectorError: StaticInjectorError(AppModule)[AppComponent -> GoogleTagManagerService]: Angular 8

Question

我还导入了 HttpClientModule 并正确配置了 GoogleTagManagerService。

import { HttpClientModule, /* other http imports */ } from "@angular/common/http";

@NgModule({
  imports: [
   HttpClientModule,
  ]}),
  providers: [
    { provide: 'googleTagManagerId', useValue: 'GTM-XXXXXXX' }
  ],
});

但我仍然遇到错误。我正在使用 Google 跟踪代码管理器包并正确导入所有内容。现在我在新系统中克隆项目，所以现在我收到这个错误

app.component.ts代码

import { GoogleTagManagerService } from 'angular-google-tag-manager';

constructor(
  private gtmService: GoogleTagManagerService
) {}

ngOnInit(): void {
  this.router.events.subscribe((evt) => {
    if (evt instanceof NavigationEnd) {
      const gtmTag = {
        event: 'page',
        pageName: evt.url
      };
      this.gtmService.pushTag(gtmTag);
    }
    if (!(evt instanceof NavigationEnd)) {
      return;
    }
  });
}

Answer 1

看来一切正常。您可以使用 ng run.

重新启动您的应用程序

我建议您按照该博客上的步骤操作：

https://itnext.io/how-to-add-google-tag-manager-to-an-angular-application-fc68624386e2

或者，您可以 cross-check 您的应用程序 demo-page。

https://github.com/mzuccaroli/angular-google-tag-manager/tree/master/demo-application

最后但同样重要的是，您可以 re-install 包裹。

https://www.npmjs.com/package/angular-google-tag-manager

Answer 2

正如您在该软件包的已解决问题中看到的那样，您必须为 angular 8 (https://github.com/mzuccaroli/angular-google-tag-manager/issues/38)

使用该软件包的旧版本

npm i --save angular-google-tag-manager@1.1.4

NullInjectorError: StaticInjectorError(AppModule)[AppComponent -> GoogleTagManagerService]: Angular 8

NullInjectorError: StaticInjectorError(AppModule)[AppComponent -> GoogleTagManagerService]: Angular 8

google-tag-manager

angular

angular8