0

He creado un pipe en Ionic 4 y importandolo como se supone que se debe importar pero cuando lo intento utilizar en cualquier archivo html de mis páginas señal que no se puede encontrar dicho elemento.

Importacion

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 { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';

import { DatosSubnetService } from './service/datos-subnet.service';
import { IpsPipe } from './pipes/ips.pipe';

@NgModule({
  declarations: [AppComponent, IpsPipe],
  entryComponents: [],
  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
  providers: [
    StatusBar,
    DatosSubnetService,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

PIPE

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

@Pipe({
  name: 'ips'
})
export class IpsPipe implements PipeTransform {

  ip: string;

  transform(ip: number[], args: any[]): string {
    this.ip = String(ip.join('.'));
    return this.ip;
  }

}

1 respuesta 1

0

Problema resuelto, en lugar de poner el pipe como recurso general en app.module.ts se debe de colocar en donde realmente se usa el pipe, en mi caso fue en la pantalla de subnet.page.ts por lo que quedaria de la siguiente forma.

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';

import { IonicModule } from '@ionic/angular';

import { SubnetPage } from './subnet.page';
import { IpsPipe } from '../pipes/all-pipes.pipe';


const routes: Routes = [
  {
    path: '',
    component: SubnetPage
  }
];

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild(routes)
  ],
  declarations: [SubnetPage, IpsPipe]
})
export class SubnetPageModule {}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.