为什么我导入“Common”模块仍然不能在 Angular 7 中使用 DatePipe？答案

【问题标题】：Why I import `Common` module still can't use DatePipe in Angular 7?为什么我导入“Common”模块仍然不能在 Angular 7 中使用 DatePipe？
【发布时间】：2019-11-17 20:27:33
【问题描述】：

在我看来，如果A.module 导入B.module 和B.module 导入C.module，那就是A.module 导入C.module。这就是为什么许多 Angular 开发人员构建一个名为 Shared.module 的公共模块的原因。

但是，这条规则似乎不适用于DatePipe。我已经建立了一个Shared.module，CommonModule 在这个模块中被导入和导出。然后我在AppModule 中导入Shared.module。官方文档告诉我DatePipe属于CommonModule。

很遗憾，浏览器控制台显示错误：NullInjectorError: "StaticInjectorError(AppModule)[AppComponent -> DatePipe]:

您可以在下面的链接中看到代码。

https://stackblitz.com/edit/angular-common-datepipe?embed=1&file=src/app/app.component.ts

谁能帮我解决这个问题？

【问题讨论】：

这个stackoverflow.com/questions/41280149/…的可能副本
您可以将其声明为成员变量，而不是将DatePipe 提供给构造函数，如下所示：readonly datePipe = new DatePipe('en-US');

标签： angular module date-pipe

【解决方案1】：

你说的是对的。出现上述原因的原因是在CommonModule中，DatePipe没有注册为provider。

您可以在共享模块中添加 DatePipe 作为提供程序。

providers: [DatePipe]

【讨论】：

只有DatePipe需要手动提供？或者任何 Angular 管道都需要它？

【解决方案2】：

管道在 Angular 中是不可注入的。您必须自己手动提供。

@NgModule({
   declarations: [AppComponent],
   providers: [DatePipe]
   // ....
{)
export class AppModule {}

【讨论】：

只有DatePipe需要手动提供？或者任何 Angular 管道都需要它？