Importing pipes in ionic 2 rc1?

Ionic Framework ionic-v3
1

No Directive annotation found on

2 
@Pipe({name: 'myPipe'}) // this one is use in your html {{ ... | myPipe }}
export class MyPipe implements PipeTransform {

      transform(input:any) : any {
          // Do stuffs
         return stuffs;
     }
   }

Has then to be declared in the “declarations” part of your app.module.ts

You could place your pipes in src/pipes (if folder doesn’t exists, just create it on your filesystem)

3

Yes thanks, it worked but we need to add @Injectable (). Example:

@Pipe({name: ‘myPipe’}) // this one is use in your html {{ … | myPipe }}
@Injectable()
export class MyPipe implements PipeTransform {

  transform(input:any) : any {
      // Do stuffs
     return stuffs;
 }

}

4

Really?

I didn’t and it seems to work

5

really do not need @Injectable ().

I just tested and it works perfectly.

The command: ionic generate pipe mypipe, creates a pipe as follows:

import { Injectable, Pipe } from ‘@angular/core’;

@Pipe({
name: ‘mypipe’
})
@Injectable()
export class Mypipe {

transform(value, args) {
value = value + ‘’; // make sure it’s a string
return value.toLowerCase();
}
}

6

Cool. Quickly checked the angular2 documentation, they don’t use injectables neither (see ExponentialStrengthPipe example)

https://angular.io/docs/ts/latest/guide/pipes.html

1 Like
7

so,i’m using “ionic-angular”: "^2.0.0-rc.1"
and this will work:

@Pipe({
  name:"YourCoolPipe"
})
export class YourCoolPipe implements PipeTransform{
  transform(input:any,args:any){
    //dosomething here
    return //yourResult;
  }
}

and finally,you need to add this pipe to your @NgModule right in declarations arrays

hope this will help you

:slight_smile:

8

Use the generators, saves you from quite some trouble.

except you need to remove the args in the filter call if you dont use them, otherwise you’ll get errors