イオン3：パイプ ''を見つけることができませんでした

Question

私はこの問題に関していかなる誤りも見られません。私はすでにapp.module.tsにインポートし、それを '宣言'に入れます。

app.module.tsで

import { NgModule, ErrorHandler } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular'; 
import { MyApp } from './app.component'; 

//ionic-native 
import { NativeStorage } from '@ionic-native/native-storage'; 
import { StatusBar } from '@ionic-native/status-bar'; 
import { SplashScreen } from '@ionic-native/splash-screen'; 

//pipe 
import { HoursMinutesSecondsPipe } from '../pipes/hours-minutes- 
seconds/hours-minutes-seconds'; 

@NgModule({ 
declarations: [ 
MyApp, 
HoursMinutesSecondsPipe 
], 
imports: [ 
BrowserModule, 
IonicModule.forRoot(MyApp, { 
    platforms: { 
    android: { 
     tabsPlacement: 'top' 
    } 
    } 
}), 
], 
bootstrap: [IonicApp], 
entryComponents: [ 
MyApp, 
], 
providers: [ 
StatusBar, 
SplashScreen, 
{provide: ErrorHandler, useClass: IonicErrorHandler}, 
NativeStorage, 
] 
}) 
export class AppModule {} 

使用法：時間 - 分 - seconds.tsで

<ion-card class="card-container" (click)="onTimer()"> 
     <img src="assets/imgs/wp1.png"/> 
     <div class="card-title">Time Smoke Free</div> 
     <div class="card-subtitle">{{ seconds | hoursMinutesSeconds }}</div> 
    </ion-card> 

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

    @Pipe({ 
     name: 'hoursMinutesSeconds', 
    }) 

    export class HoursMinutesSecondsPipe implements PipeTransform { 

     transform(value, args?) { 

     let minutes = Math.floor(value/60); 
     let hours = Math.floor(minutes/60); 
     let seconds = Math.floor(value % 60); 

     let timeString = hours + 'hrs ' + minutes + 'mins ' + seconds + 'secs'; 

     return timeString; 

     } 
    } 

エラー：（約束で） キャッチされません：エラー：テンプレート解析エラー： 'hoursMinutesSeconds'パイプが見つかりませんでした（ "img s/wp1.png "/> 時間スモークフリー {{[ERROR - >]秒| hoursMinutesSeconds}}

Answer 1

あなたはこのCLI ionic generate pipe HoursMinutesSecondsを使用してpipeを作成すると、それはpipes.module.tsと呼ばれる共有モジュールを作成します。したがって、ページのモジュールファイル内にimportPipesModuleモジュールが必要です。

ページがmy-viewであるとしましょう。

私-view.module.ts

import { NgModule } from '@angular/core'; 
import { IonicPageModule } from 'ionic-angular'; 
import { MyViewPage } from './my-view'; 
import { PipesModule } from '../../pipes/pipes.module';//<--- here 

@NgModule({ 
    declarations: [ 
    MyViewPage, 
    ], 
    imports: [ 
    IonicPageModule.forChild(BudgetGroupViewPage), 
    PipesModule // <--- here 
    ], 
}) 
export class MyViewPageModule { }