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

正如您在此软件包中已解决的问题中所见，您必须将此软件包的旧版本用于 angular 8 ( https://github.com/mzuccaroli/angular-google-tag-manager/issues/38 )

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

Answer 2

似乎一切正常。 您可以使用ng run重新启动您的应用程序。

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

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

或者，您可以使用演示页面交叉检查您的应用程序。

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

而且，最后但并非最不重要的是，您可以重新安装该软件包。

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