Creating your own Angular2 pipe.

Creating angular 2 pipe is easy.

First we need to create our pipe component and then wire up into basic component.

Lets get started. We are going to create a pipe component that takes a given number and add it up with a hard coded number like this.

{{ 1 | addup: 10 }}

1 is the given number.
10 is a hard coded number.

Lets create our pipe component. As you can see, we only need to decorate with @Pipe and implement PipeTransform and override "transform method"

And lets use it in our component :-

So we are importing our pipe "Addup" component in and then we need to inject our pipe in our component.

Finally, use the | operator to apply our newly created operator.

That's it. 


Popular posts from this blog

OpenCover code coverage for .Net Core

Android Programmatically apply style to your view

Using Custom DLL with IronPython / Scripts