recently l create my own pipe in ionic4 name is StatusairportPipe
. Then l imported it in app module.ts
, now when l am trying to use it l got errors:
ERROR Error: Uncaught (in promise): Error: Template parse errors:
The pipe 'my' could not be found ("
<td text-center>{{item?.flight.aircraft.model.code}}</td>
<td text-right>{{[ERROR ->]item?.flight.status.generic.status.text | my}}</td>
</tr>
StatusairportPipe
model ts
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'my'
})
export class StatusairportPipe implements PipeTransform {
public states: Object = {
'scheduled': 'مجدولة',
};
transform(value: string, ...args) {
// This is our catch for data that hasn't interpolated
// from its source yet, a basic async fix.
if(value == null) return;
// Otherwise, lookup the state name from the acronym
if(this.states[value]){
return this.states[value];
} else {
return value;
}
}
}
app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';
import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HTTP } from '@ionic-native/http/ngx';
import { Network } from '@ionic-native/network/ngx';
import { StatusairportPipe } from './statusairport.pipe';
@NgModule({
declarations:
[AppComponent,
StatusairportPipe
],
entryComponents: [],
imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
exports:[
StatusairportPipe,
AliPipe
],
providers: [
StatusBar,
SplashScreen,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
HTTP,
Network
],
bootstrap: [AppComponent]
})
export class AppModule {}
When I created my own pipe in ionic 4
you need only add it the pipe your created already in module of page you want use. You don`t need to add in app.module