Angular:用逗号格式化数字

Question

Angular:用逗号格式化数字

Bei*_*man 22 javascript typescript angular

标题非常总结了我的需求.

123456789 => 123,456,789
12345 => 12,345

Run Code Online (Sandbox Code Playgroud)

获得此转换的最佳方式是什么？不要在Angular-2中建议货币管道,因为我不需要$或货币符号作为我的输出的前置.

Answer 1

Cod*_*ior 40

像这样使用DecimalPipe

{{attr | number}}

工作的Plunker

可从https://angular.io/api/common/DecimalPipe获取文档

Answer 2

Seb*_*iro 6

不使用管道，使用javascript回答问题的简单方法：

var str = "The quick brown fox jumps over the lazy dogs.".replace(/(.{2})/g,"$1,");

Run Code Online (Sandbox Code Playgroud)

这将输出 Th,e ,qu,ic,k ,br,ow,n ,fo,x ,ju,mp,s ,ov,er, t,he, l,az,y ,do,gs,.

但是我认为您提出的问题不好，因此，如果要解析数字，则应使用以下功能：

function numberWithCommas(x) {
    var parts = x.toString().split(".");
    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    return parts.join(".");
}

Run Code Online (Sandbox Code Playgroud)

所以

var num = numberWithCommas(1234567);
console.log(num);

Run Code Online (Sandbox Code Playgroud)

这将输出 1,234,567

Answer 3

JGF*_*FMK 6

function printNo() {
  document.getElementById('text').innerHTML =
  Number(1234355).toLocaleString('en-GB');
}

Run Code Online (Sandbox Code Playgroud)

 <!DOCTYPE html>
 <html>
    <head></head>
    
     <body onload="printNo()">
      <h1 id="text"></h1>
        
     </body>
</html>

Run Code Online (Sandbox Code Playgroud)

参考链接

Answer 4

小智 5

CodeWarrior 对管道的回答非常适合前端显示。如果您的号码易于隔离并通过 HTML 传输，则推荐使用。但有时，在组装显示内容之前，在 Typescript/Javascript 中获取格式化数字要方便得多。

对于 Angular 中的 Typescript，formatNumber()@angular/common 将以逗号分隔数字。以num字符串“12345”为例：

formatNumber(Number(num), 'en-US', '1.0-0')

将生成“12,345”作为另一个字符串。显然，不同的语言环境会以不同的方式格式化数字（“en-US”使用“,”和“.”），digitsInfo 的第三个选项可以定义是否需要小数（“1.0-0”建议在“.”之前使用一位数字）。 ' 和后面的零）。

您将需要导入 formatNumber

import {formatNumber} from '@angular/common';

文档位于https://angular.io/api/common/formatNumber

归档时间：	8 年，8 月前
查看次数：	32341 次
最近记录：	7 年，2 月前