Angular6库管

Question

如何在 Angular 6 库中添加自定义管道以使其在我的主应用程序中可用？目前我正在这样做： lib.module.ts:

@NgModule({
  declarations: [
    SomePipe
  ],
  exports: [
   SomePipe
]})

在public_api.ts中：

export * from './lib/pipes/some.pipe';

在app.module.ts中：

import { LibModule } from 'lib';
@NgModule({
  ...
  imports: [
    LibModule
  ]
 ...
})

我正在尝试使用管道 {{ 'something' | some}}，但未调用 SomePipe 的 transform 方法。

Answer 1

所以问题似乎出在这里：

export * from './lib/pipes/some.pipe';

当您应该从模块文件中导出模块 (@NgModule) 时，您正在从 some.pipe 文件中导出所有内容。像这样：

export * from './lib.module';

这样做应该可以解决问题。

这里有一个 Sample StackBlitz 供您参考。

Answer 2

自定义管道已正确添加，并且在我的应用程序中正常工作。还有另一个我没能看到的错误，关于我的@Pipe 在 transform() 方法中使用的服务 （从库中错误导入）。因此，transform() 总是显得 return 什么都没有，因为它依赖于该服务。

Answer 3

您需要转到模块并从该表单导入管道：

import { SePipeModule } from 'se-component';

在这种情况下，“se-component”是您托管管道的“库”angular 的名称，“SePipeModule”是管道模块。在 "public-api.ts":

中导出管道名称非常重要

export {SeTestPipe} from './lib/se-pipe/se-test-pipe';

Angular 6 library pipe