以角度4显示百万或千格式的数字

Question

我试图在我的角度4应用程序中显示数字格式.基本上我正在看的是,如果数字是12.23百万,那么它应该显示例如12.2M(小数点后一位)

如果数字是50,000.123那么50.1K

我如何在角度上实现这一点.我需要写一个指令吗？有角度的内置管道吗？

结构体

export interface NpvResults  {

            captiveInsYear: number[];
            captiveInsPremiumPaid: number[];
            captiveInsTaxDeduction: number[];
            captiveInsLoanToParent: number[];
            captiveInsCapitalContribution: number[];
            captiveDividentDistribution: number[];
            captiveInsTerminalValue: number[];

        }

该数组初始化为以下值

this.sourceResults.captiveInsPremiumPaid = [1,2,3,4,5];

HTML

<td *ngFor= "let item of NpvResults.captiveInsPremiumPaid" >{{item}}</td>

Answer 1

你可以创建PIPE

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

@Pipe({
  name: 'thousandSuff'
})
export class ThousandSuffixesPipe implements PipeTransform {

  transform(input: any, args?: any): any {
    var exp, rounded,
      suffixes = ['k', 'M', 'G', 'T', 'P', 'E'];

    if (Number.isNaN(input)) {
      return null;
    }

    if (input < 1000) {
      return input;
    }

    exp = Math.floor(Math.log(input) / Math.log(1000));

    return (input / Math.pow(1000, exp)).toFixed(args) + suffixes[exp - 1];


  }

}

在视图中实现

{{ model | thousandSuff  }} <!-- 0 decimals -->

{{ model | thousandSuff : 2  }}  <!-- X decimals -->

结果

{{22600000 | 千寿司}} - > 23M

{{22600000 | 千寿:2}} - > 22.60M

Answer 2

在这里，我只是给你一个想法，首先创建
Html，
{{number | shortNumber}}
你可以创建自己的custom pipe filterHtml，在其中你可以在管道中传递你的号码，然后，你可以执行如下代码，将此逻辑放入你的自定义管道中。

管道过滤器

getformat(){
    if(number == 0) {
    return 0;
}
else
{        
  // hundreds
  if(number <= 999){
    return number ;
  }
  // thousands
  else if(number >= 1000 && number <= 999999){
    return (number / 1000) + 'K';
  }
  // millions
  else if(number >= 1000000 && number <= 999999999){
    return (number / 1000000) + 'M';
  }
  // billions
  else if(number >= 1000000000 && number <= 999999999999){
    return (number / 1000000000) + 'B';
  }
  else
    return number ;
  }
}

你可以这样做。要创建自定义管道，你可以参考这个网站点击这里