Angular2 RC1 Pipes Always Passing Undefined



After upgrading to RC1 from Beta, pipes don’t seem to be correctly passing data. I am receiving the following:

ORIGINAL EXCEPTION: TypeError: Cannot read property '1' of undefined
TypeError: Cannot read property '1' of undefined

This is an old plunker, but it shows the way I am using pipes within my application.

Sometimes I get no errors at all and it treats the page as if there were no pipes whatsoever.





On version 2.0.0-beta.16, pipes had breaking changes. From angular2 changelog

pipes now take a variable number of arguments, and not an array that contains all arguments.

So, instead of transform(value, args){} it’s now transform(value,args...){}


transform(value, [arg1,arg2,arg3])


transform(value, arg1, arg2, arg3)

If you don’t want to make any changes to your pipes, you could still use them but you need to change the way you add arguments



change it to:

{{someValue|somePipe:[arg1,arg2]}} // this will work with the new syntax without changing anything in the pipe itself

Or, the better way, is to change your pipes and make the transform method accepts multiple arguments instead of one array.

Now, going to the plunk on your question:

All you need to make it work with the new versions is to change:

transform(input:any, [config = '+']): any{


transform(input:any, config = '+'): any{

And that’s it. Because in your code, you never call the pipe with more than one argument. It’s always an array of arguments, that fits perfectly with the new syntax.

Here is your plunk fixed


Facebook Comments

Post a comment