I have an issue that is exactly similar to this issue but it seems to have no answer yet. I created a brand new project in Ionic 3 where I have a custom pipe that converts seconds to minutes. But I am simply getting the following error:
Uncaught Error: Template parse errors:
The pipe 'duration' could not be found ("
</ion-header>
<ion-content padding> {{ [ERROR ->]2000 | duration }} </ion-content>
I am not sure what I am doing wrong for the duration pipe not to be found. I have included all the relevant code and version information below. Any pointers on what I am doing wrong would be appreciated.
# ionic info
Ionic:
ionic (Ionic CLI) : 4.8.0 (/usr/local/lib/node_modules/ionic)
Ionic Framework : ionic-angular 3.9.2
@ionic/app-scripts : 3.2.1
System:
NodeJS : v10.8.0 (/usr/local/Cellar/node/10.8.0/bin/node)
npm : 6.3.0
OS : macOS Mojave
# home.html
<ion-content padding> {{ 2000 | duration }} </ion-content>
# home.ts
import { Component } from '@angular/core'
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
constructor() {}
}
# home.module.ts
import { NgModule } from '@angular/core'
import { IonicPageModule } from 'ionic-angular'
import { HomePage } from './home'
import { PipesModule } from '../../pipes/pipes.module'
@NgModule({
declarations: [HomePage],
imports: [IonicPageModule.forChild(HomePage), PipesModule]
})
export class TestPageModule {}
# pipes.modules.ts
import { NgModule } from '@angular/core';
import { DurationPipe } from './duration/duration';
@NgModule({
declarations: [DurationPipe],
imports: [],
exports: [DurationPipe]
})
export class PipesModule {}
# duration.ts
import { Pipe, PipeTransform } from '@angular/core'
@Pipe({
name: 'duration'
})
export class DurationPipe implements PipeTransform {
transform(value: number, ...args) {
return Math.floor(value / 60)
}
}