Thousand Separator

With Comma

{{ number | number: '1.0-0' }}

420,000

With Space

420 000

Thousand Separator Pipe

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'thousandSeparator',
  standalone: true,
})
export class ThousandSeparatorPipe implements PipeTransform {
  transform(value: number): string {
    return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ' ');
  }
}

{{ number | thousandSeparator }}

Ha az adat, ami backendről érkezik string

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'thousandSeparator',
  standalone: true,
})
export class ThousandSeparatorPipe implements PipeTransform {
  public transform(value: number | string): string {
    if (typeof value === 'string') {
      const parsedValue = parseFloat(value.replace(/,/g, ''));
      if (isNaN(parsedValue)) {
        return value;
      }
      value = parsedValue;
    }

    return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ' ');
  }
}