NullInjectorError：RouterStateSerializer没有提供程序

Question

我将一个小的Angular 6项目升级到了8，并且现在遇到了一个我不理解的错误。

  StaticInjectorError(Platform: core)[StoreRouterConnectingModule -> RouterStateSerializer]: 
    NullInjectorError: No provider for RouterStateSerializer!
    at NullInjector.get (http://localhost:4200/vendor.js:36416:27)
    at resolveToken (http://localhost:4200/vendor.js:36743:24)
    at tryResolveToken (http://localhost:4200/vendor.js:36669:16)
    at StaticInjector.get (http://localhost:4200/vendor.js:36532:20)
    at resolveToken (http://localhost:4200/vendor.js:36743:24)
    at tryResolveToken (http://localhost:4200/vendor.js:36669:16)
    at StaticInjector.get (http://localhost:4200/vendor.js:36532:20)
    at resolveNgModuleDep (http://localhost:4200/vendor.js:58166:29)
    at _createClass (http://localhost:4200/vendor.js:58243:32)
    at _createProviderInstance (http://localhost:4200/vendor.js:58199:26)

能否有人帮忙看看并给我一些提示。代码可以在这里找到。提前感谢！

- wendellmva

---

您是否也升级了ngrx？ - Reza

我使用create-nx-workspace重新创建了项目，因此我认为ngrx 8是与angular 8相对应的正确版本。 - wendellmva

你是否正确导入了模块？因为这个错误意味着其中一个类需要 RouterStateSerializer，但是它没有被提供。可能是你的类或其中一个依赖项。我建议再次查看 ngrx 文档，并确保正确导入了模块。（顺便说一句，你提到升级了一个项目，但似乎创建了一个新项目，这很容易让人误解 ;) ） - Reza

Answer 1

从6到8版本，StoreouterConnectingModule的导入语句略有变化，你需要像ngrx文档这里所示一样调用forRoot()方法。

代码示例：

import { StoreRouterConnectingModule, routerReducer } from '@ngrx/router-store';
import { AppComponent } from './app.component';

@NgModule({
  imports: [
    BrowserModule,
    StoreModule.forRoot({
      router: routerReducer,
    }),
    RouterModule.forRoot([
      // routes
    ]),
    // Connects RouterModule with StoreModule
    StoreRouterConnectingModule.forRoot(),
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

- Ganapat

Answer 2

我设法让它工作 - 但请注意其他回答解释了问题的本质，而不仅仅是一个简单的“愚蠢”的修复方法。

打开文件cards.module.ts并删除StoreRouterConnectingModule的导入，它是多余的...它构建和运行得很完美。

不客气 :) 注：Original Answer翻译成“最初的回答”。

- Kashkashio

---

虽然被接受为这个问题的答案，但是删除导入不应该被视为解决问题的“修复”。第二个回答 https://dev59.com/8bTma4cB1Zd3GeqP_Lz3#57465624 拥有更多的赞同票，因为它实际上提供了错误原因和“真正”的解决方案。这对于那些实际需要使用导入的人来说尤其重要，在我的情况下，它来自一个升级，下面的答案解决了这个问题。 - Donovan

谢谢您详细阐述，尽管问题不在于如何使这个东西工作。情况是不同的。有一些包/库，人们无法找到使它们工作的方法。提供一个小提示来解决问题可能被认为是一种解决方案，但是我肯定可以理解您所写的内容，并且我会接受接受的答案被更改 ：D - Kashkashio

在这种情况下，“使工作”不需要任何东西，因为由于更新的代码，使用的语法永远不会起作用。删除任何插件都将删除与该插件有关的错误，并且不应被视为“修复”或“解决方案”。如果某人（比如我自己）实际上遇到了这个问题，你的答案根本不会帮助他们。这就是我指出实际上解决了我的问题的评论的唯一原因，以便将来的任何人都不会看到你的答案并放弃寻找。 - Donovan

你很厉害，@Kashkashio。 - Donovan