Case #1: Import only to app.module.ts a Pipe file

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import {MyPipe} from '../pipes/my/my';

@NgModule({
  declarations: [
    MyApp,
    HomePage,
    MyPipe
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

home.html

<ion-header>
  <ion-navbar>
    <ion-title>
      {{'home' | myPipe}}
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

  <a (click)="openPage(1)"> Page #1 </a>
  <a (click)="openPage(2)"> Page #2 </a>
</ion-content>

my.ts

import { Pipe, PipeTransform } from '@angular/core';


@Pipe({
  name: 'myPipe',
})
export class MyPipe implements PipeTransform {
  /**
   * Takes a value and makes it lowercase.
   */
  transform(value: string, ...args) {
    return value + ' is piped. OK!';
  }
}

page1.html

<ion-header>

  <ion-navbar>
    <ion-title>page1</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>
  {{'test1' | myPipe}}
</ion-content>

page1.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { Page1Page } from './page1';
// import {MyPipe} from "../../pipes/my/my";

@NgModule({
  declarations: [
    Page1Page,
    // MyPipe
  ],
  imports: [
    IonicPageModule.forChild(Page1Page),
  ],
})
export class Page1PageModule {}

page2.html

<ion-header>
  <ion-navbar>
    <ion-title>page2</ion-title>
  </ion-navbar>
</ion-header>


<ion-content padding>
{{'test2' | myPipe}}
</ion-content>

page2.modul.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { Page2Page } from './page2';
// import {MyPipe} from "../../pipes/my/my";

@NgModule({
  declarations: [
    Page2Page,
    // MyPipe
  ],
  imports: [
    IonicPageModule.forChild(Page2Page),
  ],
})
export class Page2PageModule {}