0

Let's say I have a pipeVar, it can be any pipe, eg.: number, uppercase, customPipe, etc

Is there a simple way to just call something like

{{ myVal | pipeVar }}

or some special syntax like

{{ myVal | #pipeVar }}

?

The closest thing I have found so far is Dynamic pipe in Angular 2

Community
  • 1
  • 1
techguy2000
  • 4,861
  • 6
  • 32
  • 48
  • Check this https://plnkr.co/edit/Vz88zzWwzPbqgIpMinPp?p=preview – yurzui Feb 15 '17 at 05:03
  • @yurzui Thanks for the plunker. I was thinking about the similar implementation. But pipes with additional arguments need to be supported as well. Also, I think I need to support multiple pipes to be ideal, like `passThrough:[actualPipes]` – techguy2000 Feb 15 '17 at 06:26
  • please check this plunkr https://plnkr.co/edit/xX1klYoaGMq1O2TJzu8w?p=preview – bipin patel Feb 15 '17 at 06:29
  • @bipinpatel But it won't work with aot. http://stackoverflow.com/questions/39252944/invoke-pipe-during-run-time-using-pipe-name-metadata – yurzui Feb 15 '17 at 06:37
  • @bipinpatel Your example of using – techguy2000 Feb 15 '17 at 17:25
  • https://plnkr.co/edit/2lpPMUIKt59pnTNd3jCP?p=preview – bipin patel Feb 16 '17 at 06:36
  • can you explain pipe,pipe2 ... pipeN how it come from any service or any global defined variable? – bipin patel Feb 16 '17 at 06:45
  • @bipinpatel I am not sure this is what you are asking. But they will just be an array of strings. They will be passed into a component, and that component will dynamically apply them as pipes for formatting the display. – techguy2000 Feb 17 '17 at 15:16

1 Answers1

0

i have update plunkr plunkr link

Change in dynamic-pipe.ts like this

const dynamicPipe = "";
//i have give one simple logic for example if your dynamic pipe is like
this.dynamicPipe = ['number','uppercase','customPipe']; //pipe,pipe1 ... pipeN
//now create a one variable like 'number' | 'uppercase' | 'customPipe' 
for (let i=0;i<this.dynamicPipe.length;i++){
     dynamicPipe = dynamicPipe + " | "+this.dynamicPipe[i];
}
@Component({
    selector: 'dynamic-comp',
    template: '{{ data ' + dynamicPipe + '}}'
})
bipin patel
  • 2,061
  • 1
  • 13
  • 22