Как отформатировать ввод числа в угловых

Question

У меня есть такой ввод числа

, и я хочу что-то подобное (неважно, каким будет разделитель)

Мой настоящий код работает следующим образом:

<div class="row center-xs" *ngFor="let item of listItem;let i=index">
    <div class="col-xs-12 col-md-10">
        <mat-form-field>
            <input [disabled]="item.lock!=0" type="number" matInput [placeholder]="item.name" [(ngModel)]="item.concept" >                                      
        </mat-form-field>
    </div>
</div>

Как мне этого добиться?

Answer 1

Вы можете использовать канал «число» в Angular.

https://angular.io/api/common/DecimalPipe

Этот канал управляет цифрами дроби, а также форматированием числа на основе локали(по умолчанию: en-US).

Таким образом, число типа: 2000000 будет преобразовано в 2,000,000.В зависимости от локали разделители будут различаться.

@Component({
  selector: 'number-pipe',
  template: `
    <!--output '2,000,000'-->
    {{e | number}}
  `
})
export class NumberPipeComponent {
  e: number = 2000000;
}