Angularjs避免号码过滤科学记数法 [英] Angularjs avoid scientific notation for number filter

问题描述

我需要为我的应用程序打印非常小的数字。我preFER，如果他们都以十进制格式显示。有没有办法与angularjs号码过滤做到这一点还是我写我自己的或以某种方式修改现有的？

http://jsfiddle.net/ADukg/2386/

的JavaScript

  VAR对myApp = angular.module（'对myApp'，[]）; 功能MyCtrl（$范围）{
   $ scope.MyNum1 = 0.000001;
   $ scope.MyNum2 = 0.0000001;
 }
 

HTML

 ＆LT; D​​IV NG控制器=MyCtrl＆GT;
  小号码：{{MyNum1 |数量：8}}＆LT; BR /＆GT;
  极少数：{{MyNum2 |数量：8}}
＆LT; / DIV＆GT;
 

不一致输出

 小数目：0.00000100
极少数：1E-7
 

解决方案

我还没有完全测试这一点，我不知道如何得到这个工作的jsfiddle，但是这似乎是工作暂时

的JavaScript

  VAR应用= angular.module（'对myApp'，[]）;app.filter（'DecimalFormat的'，函数（）{
  复位功能（文本）{
    返回parseFloat（文本）.toFixed（20）.replace（/ 0 + $ /，''）;
  };
}）;
 

HTML

 ＆LT; D​​IV NG控制器=MyCtrl＆GT;
  小号码：{{MyNum1 |数量：8 | DecimalFormat的}}＆LT; BR /＆GT;
  极少数：{{MyNum2 |数量：8 | DecimalFormat的}}
＆LT; / DIV＆GT;
 

兰登的评论后编辑，添加逗号：

的JavaScript

  VAR应用= angular.module（'对myApp'，[]）;app.filter（'小数'，函数（）{
  复位功能（文本）{
      VAR部分= parseFloat（文本）.toFixed（8）.split（'。'）;
      部分[0] =零件[0] .replace（/ \\ B（=（\\ d {3}）+（\\ D））/克，'，'？！）;
      返回parts.join（'。'）;
    }
  };
}）;功能MyCtrl（$范围）{
  $ scope.MyNum1 = 0.12345678912;
  $ scope.MyNum2 = 0.000000100001;
  $ scope.MyNum3 = 0;
  $ scope.MyNum3 = 1123123.05;
}
 

HTML

 ＆LT; D​​IV NG控制器=MyCtrl＆GT;
  小号码：{{MyNum1 |小数点}}＆LT; BR /＆GT;
  极少数：{{MyNum2 |小数点}}＆LT; BR /＆GT;
  零：{{MyNum3 |小数点}}＆LT; BR /＆GT;
  万：{{MyNum4 |小数点}}＆LT; BR /＆GT;
＆LT; / DIV＆GT;
 

I need to print very small numbers for my app. I prefer if they were all displayed in decimal format. Is there a way to do this with the angularjs number filter or do I have to write my own or modify the existing one somehow?

http://jsfiddle.net/ADukg/2386/

Javascript

var myApp = angular.module('myApp',[]);

 function MyCtrl($scope) {
   $scope.MyNum1 = 0.000001;
   $scope.MyNum2 = 0.0000001;
 }

HTML

<div ng-controller="MyCtrl">
  Small Number: {{MyNum1 | number:8}}<br/>
  Very Small Number: {{MyNum2 | number:8}}
</div>

Inconsistent Output

Small Number: 0.00000100
Very Small Number: 1e-7

解决方案

I haven't fully tested this and I'm not sure how to get this working on jsfiddle, but this seems to be working for the time being.

Javascript

var app = angular.module('myApp', []);

app.filter('decimalFormat', function () {
  return function (text) {
    return parseFloat(text).toFixed(20).replace(/0+$/,'');
  };
});

HTML

<div ng-controller="MyCtrl">
  Small Number: {{MyNum1 | number:8 | decimalFormat}}<br/>
  Very Small Number: {{MyNum2 | number:8 | decimalFormat}}
</div>

Edit after Langdon's comment, added commas:

Javascript

var app = angular.module('myApp', []);

app.filter('decimal', function () {
  return function (text) {
      var parts = parseFloat(text).toFixed(8).split('.');
      parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
      return parts.join('.');
    }
  };
});

function MyCtrl($scope) {
  $scope.MyNum1 = 0.12345678912;
  $scope.MyNum2 = 0.000000100001;
  $scope.MyNum3 = 0;
  $scope.MyNum3 = 1123123.05;
}

HTML

<div ng-controller="MyCtrl">
  Small Number: {{MyNum1 | decimal}}<br/>
  Very Small Number: {{MyNum2 | decimal}}<br/>
  Zero: {{MyNum3 | decimal}}<br/>
  Million: {{MyNum4 | decimal}}<br/>
</div>

这篇关于Angularjs避免号码过滤科学记数法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！