Javascript 角度2+;添加零和逗号的管道
有没有办法通过管道将3个零附加到输入的值上 例如,如果用户键入1,则显示的值为1000 或99->99000 我试着去摆弄,但我无法让它添加正确的零数,或者使用逗号 使用自定义管道执行此操作的最佳方法是什么 谢谢创建自定义管道Javascript 角度2+;添加零和逗号的管道,javascript,angular,Javascript,Angular,有没有办法通过管道将3个零附加到输入的值上 例如,如果用户键入1,则显示的值为1000 或99->99000 我试着去摆弄,但我无法让它添加正确的零数,或者使用逗号 使用自定义管道执行此操作的最佳方法是什么 谢谢创建自定义管道 import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name: 'customCurrency' }) export class CustomCurrencyPipe implements Pip
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'customCurrency'
})
export class CustomCurrencyPipe implements PipeTransform {
transform(value: any, args?: any): any {
let x = value.toString() + '000';
var lastThree = x.substring(x.length - 3);
var otherNumbers = x.substring(0, x.length - 3);
if (otherNumbers != '')
lastThree = ',' + lastThree;
var res = otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") + lastThree;
return res;
}
}
示例:@Chellapan给出了正确的答案,我的答案只是显示您是否只想在显示的每个数字后面加上“.000”
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'customNumber'
})
export class CustomNumberPipe implements PipeTransform {
transform(value: any, args?: any): any {
let x = `${value},000`
return res;
}
}
自angular 4以来的正确和默认方式:
<p>{{99 | number:'1.3-3'}}</p>
<!--output '99.000'-->
要使用不同的区域性,请不要忘记导入区域设置
import { registerLocaleData } from "@angular/common";
import localeDe from '@angular/common/locales/de';
import localeFr from '@angular/common/locales/fr';
import localeNl from '@angular/common/locales/nl';
import localeEnGb from '@angular/common/locales/en-GB';
import localeEnUs from '@angular/common/locales/en';
registerLocaleData(localeDe, CultureType.Development);
registerLocaleData(localeFr, CultureType.fr_FR);
registerLocaleData(localeNl, CultureType.nl_NL);
registerLocaleData(localeEnGb, CultureType.en_GB);
registerLocaleData(localeEnUs, CultureType.en_US);
registerLocaleData(localeDe, CultureType.de_DE);
export class CultureType {
public static readonly Development: 'xh-ZA' = 'xh-ZA';
public static readonly de_DE: 'de-DE' = 'de-DE';
public static readonly nl_NL: 'nl-NL' = 'nl-NL';
public static readonly fr_FR: 'fr-FR' = 'fr-FR';
public static readonly en_GB: 'en-GB' = 'en-GB';
public static readonly en_US: 'en-US' = 'en-US';
}
如果希望在函数中使用区域性设置数字的格式,则可以从以下步骤开始:
import { formatNumber, getLocaleNumberSymbol, NumberSymbol } from "@angular/common";
/**
* DigitsInfo:
* {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}
* 1.2-2 => 1,00
*/
public formatNumber(num: number, digitsInfo: string): string {
const culture: string = this.languageService.getCulture();
return formatNumber(num, culture, digitsInfo);
}
您想再次将字符串解析为数字:
import { formatNumber, getLocaleNumberSymbol, NumberSymbol } from "@angular/common";
public parseStringNumber(str: string): number | null {
if (!str) {
return null;
}
const culture: string = this.languageService.getCulture();
const decimalSeparator: string = getLocaleNumberSymbol(culture, NumberSymbol.Decimal);
const groupSeparator: string = getLocaleNumberSymbol(culture, NumberSymbol.Group);
const decimalSeparatorRegex = new RegExp('\\' + decimalSeparator, 'g');
const groupSeparatorRegex = new RegExp('\\' + groupSeparator, 'g');
const normalizedString = str.replace(groupSeparatorRegex, '').replace(decimalSeparatorRegex, '.');
return parseFloat(normalizedString);
}
import { formatNumber, getLocaleNumberSymbol, NumberSymbol } from "@angular/common";
public parseStringNumber(str: string): number | null {
if (!str) {
return null;
}
const culture: string = this.languageService.getCulture();
const decimalSeparator: string = getLocaleNumberSymbol(culture, NumberSymbol.Decimal);
const groupSeparator: string = getLocaleNumberSymbol(culture, NumberSymbol.Group);
const decimalSeparatorRegex = new RegExp('\\' + decimalSeparator, 'g');
const groupSeparatorRegex = new RegExp('\\' + groupSeparator, 'g');
const normalizedString = str.replace(groupSeparatorRegex, '').replace(decimalSeparatorRegex, '.');
return parseFloat(normalizedString);
}