Tuyau personnalisé Ionic 3 | Tuyau non trouvé

Question

J'ai besoin d'aide, j'ai un problème avec le tuyau dans Ioni 3, j'ai suivi ce fil de discussion. Ionic 3 ne peut pas trouver Pipe et ce lien Le tuyau Ionic 3 à l'échelle mondiale Mais toujours pas de chance, tout ce que j'obtiens c'est que le séparateur de tuyau ne fonctionne pas, je génère mon tuyau en utilisant séparateur de tuyaux ionique g J'utilise mon tuyau comme ceci dans mon html

{{string | separator}}

mon séparateur.ts (tuyau personnalisé)

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

/**
 * Generated class for the SeparatorPipe pipe.
 *
 * See https://angular.io/api/core/Pipe for more info on Angular Pipes.
 */
@Pipe({
  name: 'separator',
})
export class SeparatorPipe implements PipeTransform {
  /**
   * Takes a value and makes it lowercase.
   */
  transform(value: string, ...args) {
    return value.toLowerCase();
  }
}

mon module.pipe.ts

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

ma page.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { InfaqPage } from './infaq';
import { PipesModule } from '../../pipes/pipes.module';

@NgModule({
  declarations: [
    InfaqPage,
  ],
  imports: [
    IonicPageModule.forChild(InfaqPage),
    PipesModule
  ],
})
export class InfaqPageModule {}

Une idée de la raison pour laquelle cela ne fonctionne pas ?

Answer 1

Étape 1 : ionic g pipe separator

Ici le générateur ionique src/pipes/pipes.module.ts => Delete ce fichier.

Étape 2 : Import tuyau dans app.module.ts fichier

import { SeparatorPipe } from '../pipes/separator/separator';

declarations: [
    ...
    SeparatorPipe
    ...
  ],

Etape 3 : Utilisez simplement pipe dans la page comme

{{'STACKOVERFLOW' | separator}}