ionic-framework - Ionic 4 - 找不到管道

Question

我有 2 页要使用自定义管道。我在 src/app 中创建了一个名为管道的文件夹。并创建了一个文件pipes.module.ts

import { NgModule } from '@angular/core';
import { TranslatePipe } from './translate.pipe';
@NgModule({
    declarations: [
        TranslatePipe
    ],
    imports: [],
    exports: [
        TranslatePipe
    ]
})
export class PipesModule {}

我从我的第一个组件模块文件中导入它
设备.module.ts

import { PipesModule } from '../pipes/pipes.module';

@NgModule({
  imports: [
    ...
    PipesModule
  ],
  declarations: [DevicesPage, ]
})
export class DevicesPageModule {}

当我使用管道时，这个组件运行良好。

但我也有另一个组件。
home.module.ts

import { PipesModule } from '../pipes/pipes.module'

@NgModule({
  imports: [
    PipesModule,
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild([
      {
        path: '',
        component: HomePage
      }
    ]),
    ComponentsModule,
    MatPaginatorModule,


  ],
  declarations: [HomePage]
})
export class HomePageModule {}

我用按钮从设备页面调用主页。但是当我单击按钮时出现错误。

管道.module.ts;

import { NgModule } from '@angular/core';
//import custom pipes here
@NgModule({
    declarations: [
        TranslatePipe
    ],
    imports: [],
    exports: [
        TranslatePipe
    ]
})
export class PipesModule {}

Answer 1

1)首先，在 src/app 文件夹(在 app 文件夹中)创建管道文件夹。

2)其次，在 cmd“ ionic 生成管道管道/搜索过滤器”=>这将在管道中生成两个文件。

3 第三，在管道文件夹中创建名为“pipes.module.ts”的文件
并将以下代码写入 => "pipes.module.ts"

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SearchfilterPipe } from './searchfilter.pipe';  //our pipe which we generate

@NgModule({
  imports: [
    CommonModule
  ],
  declarations: [SearchfilterPipe],
  exports: [SearchfilterPipe]
})
export class PipesModule { }

现在我们有了 PipesModule，我们可以生成更多管道并将它们写入管道模块。我们将只导入 PipesModule 而不是所有管道。

4)您不必在 app.module.ts 中导入 PipesModule

5)现在转到您要使用管道的页面并打开例如“anasayfa.module.ts”
并导入“PipesModule”并将其写入@ngModel 导入(它将自动创建)
请注意，您会将 PipesModule 导入到 something.MODULE.TS 而不是 something.page.ts