Angular 2: Pipe Directives

Question

What are the arguments for creating and using directives versus creating and using channels.

The scenario that arose from this issue is related to currency input and output.

If the user needs to enter a currency, why not create / use a directive that analyzes input into a formatted currency string? Another option is to take this line and display it through such a channel:

<input type="text" #val (keydown)="currencyVal=val.value" /> <h3>{{currencyVal | currency}}</h3> 

vs

 // Where mask-money is a directive that filters the //input to a formatted currency string <input type ="text" mask-money (keydown)="currencyVal=val.value" /> <h3>{{currencyVal}}</h3> 

Alternatively, a pipe can be used in a controller / component triggered by an input to filter a value.

I could ask a ton of questions about this, but I basically want to know: what are the arguments for each?

Answer 1

To bring it to a point in the simplest terms, I would say that pipe is for data management, and the directive more suitable for manipulating the DOM.

The pipe receives data as input, converts it, and displays this data in a different way.

The directive receives the DOM element, which it “attaches” and improves it with some functions.

Of course, you will find examples in which both make sense (consider Components , and you have three types of structures that need to be decided between them), and this depends more on the preference you choose.

In your example, you would use the handset. Suppose you want to display the currency value in bold and use the image icon as a currency symbol, which you probably accept the directive