number

概要

数値をテキストとしてフォーマットします。

もし、入力が数値でなければ、空文字列が返されます。

使用方法

HTMLテンプレート

{{ number_expression | number[:fractionSize] }}

JavaScript

$filter('number')(number[, fractionSize])

引数

引数 説明
number

型:numberstring

フォーマットする数値を指定します。

fractionSize(optional)

型:numberstring

数値を四捨五入する少数の桁数です。 もし、これが提供されない場合は、少数の桁数はカレントのロケールの数値フォーマットパターンから計算されます。 デフォルトのロケールでは、3になります。

戻り値 説明
 

型:string

decimalPlacesで四捨五入され、3桁毎に","が配置された数字が返ります。

デモ

<!doctype html>
<html ng-app>
  <head>
    <script src="http://code.angularjs.org/1.2.0-rc.2/angular.min.js"></script>
    <script src="script.js"></script>
  </head>
  <body>
    <div ng-controller="Ctrl">
      Enter number: <input ng-model='val'><br>
      Default formatting: {{val | number}}<br>
      No fractions: {{val | number:0}}<br>
      Negative number: {{-val | number:4}}
    </div>
  </body>
</html>
function Ctrl($scope) {
  $scope.val = 1234.56789;
}
it('should format numbers', function() {
  expect(binding('val | number')).toBe('1,234.568');
  expect(binding('val | number:0')).toBe('1,235');
  expect(binding('-val | number:4')).toBe('-1,234.5679');
});

it('should update', function() {
  input('val').enter('3374.333');
  expect(binding('val | number')).toBe('3,374.333');
  expect(binding('val | number:0')).toBe('3,374');
  expect(binding('-val | number:4')).toBe('-3,374.3330');
});
<!doctype html>
<html ng-app>
  <head>
    <script src="http://code.angularjs.org/1.2.0-rc.2/angular.min.js"></script>
<script>function Ctrl($scope) {
  $scope.val = 1234.56789;
}
</script>
  </head>
  <body>
    <div ng-controller="Ctrl">
      Enter number: <input ng-model='val'><br>
      Default formatting: {{val | number}}<br>
      No fractions: {{val | number:0}}<br>
      Negative number: {{-val | number:4}}
    </div>
  </body>
</html>

 Back to top

© 2017 Google
Licensed under the Creative Commons Attribution License 3.0.

このページは、ページトップのリンク先のAngularJS公式ドキュメント内のページを翻訳した内容を基に構成されています。 下記の項目を確認し、必要に応じて公式のドキュメントをご確認ください。 もし、誤訳などの間違いを見つけましたら、 @tomofまで教えていただければ幸いです。

  • AngularJSの更新頻度が高いため、元のコンテンツと比べてドキュメントの情報が古くなっている可能性があります。
  • "訳注:"などの断わりを入れた上で、日本人向けの情報やより分かり易くするための追記を行っている事があります。