0

Sample Code (AngularJS 1.x):

var filterNameVariable = 'myFilterName'; // Given the filter name as string

In AngularJS 1.x controller, I can inject a $filter service and then inside my function I can call any filter dynamically like $filter(filterNameVariable)(...params).

In Angular 5.x components is their as similar way to call a pipe without injecting it directly at compile time. I know if we inject a pipe into the controller with its name we can call its transform method. But I don't know which pipe will be used at compile time. I will get the name of the pipe at run-time in a variable.

Sample Code (Angular 5.x):

var pipeNameVariable = 'myPipeName'; // Given the pipe name as string

How can I get the instance of appropriate pipe with above pipe name at runtime so that I can call its transform method?

One way I think of is injecting all the pipe and using switch case for above variable I can call appropriate pipe. But their are dozens of pipe and I am not interested to inject all those pipes to my component.

Any help would be greatly appreciated. Thank you in advance.

Vimal
  • 73
  • 1
  • 12
Shridhar L
  • 559
  • 4
  • 6
  • 2
    Which pipe do you want to use from your code? If it's one of your own pipes, just make it delegate to an exported function or a service, and use that exported function or service inside your code. – JB Nizet Apr 07 '18 at 06:44
  • I would be calling custom pipes defined my me. I have dozens of such pipes already available and used in other modules of the project. – Shridhar L Apr 07 '18 at 06:46
  • Then you can simply provide them as services. But again, it would be cleaner to simply make them use exported functions or services, and to use those functions or services inside the code. – JB Nizet Apr 07 '18 at 06:48
  • As I already mentioned in my description and comment, I have lots of pipe in my project and its still growing and I am not interested in injecting all those pipe to my component. If you see my sample code in AngularJS I have quite simple option to dynamically call a filter with its name. So I am expecting a solution which is something similar to that. – Shridhar L Apr 07 '18 at 06:54
  • 2
    Well, Angular is not AngularJS. You'd better find a solution that conforms to Angular's way of doing. If your component code uses one pipe, yo already have a design problem. If it uses many (and growing), you have a serious design problem. – JB Nizet Apr 07 '18 at 06:57
  • Of course I agree with you on that, but I thought for time being I can move on with this and can think about rewriting it as service at later point. But your answer says"Do re-write now". Ok, if angular doesn't provide any way to do it, would first rewrite it and proceed. Thank you for you time. – Shridhar L Apr 07 '18 at 07:20
  • I agree with @JBNizet : delegate your pipes to an exported function or a service. It would work the same way as AngularJS did with $filter : all your pipes are registred somewhere and you just select one of them when calling $filter with a pipe name – Orodan Apr 07 '18 at 07:22
  • Similar question possible solution https://stackoverflow.com/a/39253541/6528560 – Oleksandr Poshtaruk Apr 07 '18 at 08:30

0 Answers0