Как установить локаль для чисел в angular 2.0

Формат числа в швейцарском немецком языке похож на «100 000,00» (а не «100 000,00»). Как я могу это изменить? Я безуспешно пытался изменить настройки в number_pipe.js с en-US на de-CH.

var defaultLocale: string = 'de-CH';

Есть ли обходной путь или мне нужно реализовать свой собственный канал?


person surfspider    schedule 07.06.2016    source источник
comment
Вы можете увидеть мой ответ здесь   -  person JavierFuentes    schedule 16.06.2018


Ответы (4)


Попробуйте использовать locale-number.pipe.ts или

вы можете создать простой канал на основе NumeralJs для форматирования чисел

https://github.com/adamwdraper/Numeral-js

person null canvas    schedule 07.06.2016

Если вам нужна только одна локаль для вашего приложения, вы можете прямо сейчас (@angular ~ 2.4.0) зарегистрировать поставщика локали в @NgModule.

@NgModule({
    ...
    providers: [
        {provide: LOCALE_ID, useValue: "de-CH"}
    ]
})
export class AppModule {}

person mikevinmike    schedule 29.03.2017
comment
Вы должны добавить: import {LOCALE_ID} из '@angular/core'; - person Antoine Beloeuvre; 23.06.2017
comment
И вам, возможно, придется использовать встроенный DecimalPipe в Angular, например. {{myNumberVar|number:'1.0-2'}} См. документацию (angular.io/api/common/DecimalPipe) - person John; 28.11.2018

Ниже приведено мое решение, и оно кому-то поможет.

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

@Pipe({
  name: 'amountConverter'
})
export class AmountConverterPipe implements PipeTransform {

  transform(value: number | string, locale?: string): string {
    return new Intl.NumberFormat(locale, {
      minimumFractionDigits: 2
    }).format(Number(value));
  }

}

В html вы можете использовать следующее

 <span class="strong">{{Price  | amountConverter:locale}}</span>

Формат числа будет меняться в зависимости от значения локали.

См. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat для более подробной информации.

person Janith Widarshana    schedule 15.09.2017

Лучшим вариантом для меня был знаменитый https://www.npmjs.com/package/numeral пакет. (он работает с той же логикой moment.js)

Чтобы установить его: npm i [email protected] и с типами npm i --save-dev @types/[email protected]

В вашем файле ts вы можете использовать следующее:

`R$ ${numeral(<your-model-value>).value().toLocaleString()}`

Для шаблона HTML вы можете создать Pipe следующим образом:

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

@Pipe({
  name: 'numberLocale'
})
export class NumberLocalePipe implements PipeTransform {

  transform(value: any, args?: any): any {

    const numeralNumber = numeral(value);

    return numeralNumber.value().toLocaleString();
  }
}

Кроме того, для валюты (и локалей) хорошей стратегией является использование пакета ng2-currency-mask для валютных масок в HTML (но в файлах ts вам может потребоваться "перевести" связанное значение в модель с numeral перед сохранением объекта модели.

Использование ng2-currency-mask в шаблоне HTML:

<input [(ngModel)]="model.value"
   [options]="{ prefix: 'R$ ', thousands: '.', decimal: ',' }"
   allowNegative="false" currencyMask>

И на ts перед сохранением модели:

if(this.model.value)
   this.model.value = numeral(this.model.value).value();

https://github.com/cesarrew/ng2-currency-mask

person Richard Lee    schedule 24.09.2017