format-as-currency

format-as-currency

Angular directive to format an input as a currency as the user types. Like autoNumeric for Angular.

Demo

http://bcherny.github.io/format-as-currency/demo

Installation

Install via bower or NPM:

• Bower: bower install --save format-as-currency
• NPM: npm install --save format-as-currency

Usage

<div ng-controller="myController">
  <input
    format-as-currency
    ng-model="value"
    type="text"
  >
</div>

<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/format-as-currency/format-as-currency.js"></script>
<script>
  angular
  .module('myModule', [
    'bcherny/formatAsCurrency'
  ])
  .controller('myController', function ($scope) {
    $scope.value = '' // currency input value
  })
</script>

With a custom currency symbol

<input
  format-as-currency
  currency-filter="'yuan'"
  ng-model="value"
  type="text"
>
<script>
  angular
  ...
  .filter('yuan', function ($filter) {
    return function (value) {
      return $filter('currency')(value, '¥')
    }
  })
</script>

With a custom currency formatter

<input
  format-as-currency
  currency-filter="'myFilter'"
  ng-model="value"
  type="text"
>
<script>
  angular
  ...
  .filter('myFilter', function () {
    return function (value) {
      return '¥' + value
    }
  })
</script>

With a module loader

Browserify

var formatAsCurrency = require('format-as-currency')
angular.module('myModule', [formatAsCurrency])

Rollup

import * as formatAsCurrency from 'format-as-currency'
angular.module('myModule', [formatAsCurrency])

Webpack

var formatAsCurrency = require('format-as-currency/src/format-as-currency')
angular.module('myModule', [formatAsCurrency])

Running the tests

npm test

Contributing

Contributions are welcome! Please be sure to:

• File an issue for the problem that your PR addresses
• Test your fix thoroughly
• Follow the existing code style
• Add unit tests to cover your feature, or to prevent future regressions