Non-angular percentage mask

0

How can I make a percentage mask using angular 2 +?

I want to apply it to my input:

<input type="text" [(ngModel)]="produto.indice_lucro" name="indicelucro" id="indicelucro" class="form-control">
<label for="indicelucro">Índice de Lucro (%)</label> <i matTooltip="Qual o percentual de lucro que você deseja lucrar com a venda desse produto?" class="fa fa-info-circle informacao" aria-hidden="true"></i>

I thought about using a pipe in my value:

<input type="text" value="produto.indice_lucro | percent">

It did not work well and I could not find a tutorial that taught percentage.

    
asked by anonymous 03.09.2018 / 15:28

1 answer

0

To use pipes of Angular 6 you need to use the correct bind of data. As explained in the documentation , it is necessary that the value of the variable be a number and that the {{ value | percent}} notation is used. In your case it would look something like:

<input type="text" [value]="{{ produto.indice_lucro | percent }}">

You can use location and house quantities before and after the comma as well, as a percent property parameter.

b: number = 1.3495;
<p>B: {{b | percent:'4.3-5':'fr'}}</p>
Output: 0 134,950 %
    
04.09.2018 / 14:55