如何全局声明管道以在不同的模块中使用？

现在我有一个名为的自定义管道 CurrConvertPipe

import {Pipe, PipeTransform} from '@angular/core';
import {LocalStorageService} from './local-storage';
@Pipe({name: 'currConvert', pure: false})
export class CurrConvertPipe implements PipeTransform {
  constructor(private currencyStorage: LocalStorageService) {}

  transform(value: number): number {
     let inputRate = this.currencyStorage.getCurrencyRate('EUR');
    let outputputRate = this.currencyStorage.getCurrencyRate(localStorage.getItem('currency'));
    return value / inputRate * outputputRate;
  }
}

我需要在两个不同的模块中使用它,

import './rxjs-extensions';
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { CurrConvertPipe } from './services/currency/currency-pipe';
@NgModule({
    imports: [
        BrowserModule,
        FormsModule,
        HttpModule,
        AppRoutingModule,
        Module1,         
        Module2

    ],

    declarations: [
        AppComponent,
        CurrConvertPipe
    ],
    providers: [

    ],
    bootstrap: [AppComponent]
})
export class AppModule { }

当我在Module1和Module2中导入时,它说错误,说它应该在更高级别的模块中声明.

所以我在里面宣布了 Module1

import {Pipe, PipeTransform} from '@angular/core';
import {LocalStorageService} from './local-storage';
@Pipe({name: 'currConvert', pure: false})
export class CurrConvertPipe implements PipeTransform {
  constructor(private currencyStorage: LocalStorageService) {}

  transform(value: number): number {
     let inputRate = this.currencyStorage.getCurrencyRate('EUR');
    let outputputRate = this.currencyStorage.getCurrencyRate(localStorage.getItem('currency'));
    return value / inputRate * outputputRate;
  }
}

但是当我在Module1中使用它时,它会抛出一个错误无法找到管道'currConvert'

在Angular中,共享公共指令,组件,管道等的一种好方法是使用所谓的共享模块.

这些模块声明并导出公共部件,以使它们可用于任何其他模块.

角度文档的基础部分是关于共享模块的非常好的读物.

我们以你的currConvert-pipe为例.

声明新的NgModule被调用 ApplicationPipesModule

将管道添加到-decorator元数据的declarations和exports数组中NgModule

添加管道可能需要的任何模块以用于imports阵列

// application-pipes.module.ts
// other imports
import { CurrConvertPipe } from './{your-path}';

@NgModule({
  imports: [
    // dep modules
  ],
  declarations: [ 
    CurrConvertPipe
  ],
  exports: [
    CurrConvertPipe
  ]
})
export class ApplicationPipesModule {}

应用pipes.module.ts

通过将创建的ApplicationPipesModule模块添加到imports数组中,将创建的模块导入到将要使用管道的模块中

// my-module1.module.ts
// other imports
import { ApplicationPipesModule } from './{your-path}';   

@NgModule({
 imports: [
   // other dep modules
   ApplicationPipesModule
 ],
 declarations: [],
 exports: []
})
export class MyModule1 {}

我-module1.module.ts

// application-pipes.module.ts
// other imports
import { CurrConvertPipe } from './{your-path}';

@NgModule({
  imports: [
    // dep modules
  ],
  declarations: [ 
    CurrConvertPipe
  ],
  exports: [
    CurrConvertPipe
  ]
})
export class ApplicationPipesModule {}

我-module2.module.ts

编辑:改进答案文本和示例.

您可以使用共享模块来共享您的服务，指令，管道，组件

您必须创建一个模块并导入管道，指令，服务或组件，并设置服务的声明，导出和提供程序。

将共享模块导入到所需位置并使用它。

基本上是在NgModules元数据中声明和导出的管道和指令。对于服务，请定义forRoot，它返回提供程序以访问其他模块。

shareModule.ts

import { NgModule, ModuleWithProviders } from '@angular/core';
import { appDirective } from './{your-path}';
import { appPipe } from './{your-path}';
import { appService } from './{your-path}';

@NgModule({
  declarations: [
    appPipe,
    appDirective
  ],
  exports: [
    appPipe,
    appDirective
  ]
})
export class SharingModule {
  static forRoot(): ModuleWithProviders {
    return {
      ngModule: SharingModule,
      providers: [ appService ]
    };
  }
}

my-module1.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { myComponent } from './{your-path}';

import { SharingModule } from './{your-path}';

@NgModule({
  declarations: [
    myComponent
  ],
  imports: [
    BrowserModule,
    SharingModule.forRoot()  
  ],
})
export class AppModule {}

同样，您也可以在其他模块中进行操作。