{"id":17002009,"url":"https://github.com/sagiegurari/angular-number-input","last_synced_at":"2025-06-24T04:06:07.211Z","repository":{"id":8423045,"uuid":"58304089","full_name":"sagiegurari/angular-number-input","owner":"sagiegurari","description":"AngularJS number input directive.","archived":false,"fork":false,"pushed_at":"2023-01-19T16:47:37.000Z","size":144,"stargazers_count":3,"open_issues_count":1,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-06-12T08:53:10.714Z","etag":null,"topics":["angular","angularjs-number","bower","html","number-input","web"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sagiegurari.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-05-08T08:54:32.000Z","updated_at":"2021-10-17T15:12:00.000Z","dependencies_parsed_at":"2023-02-11T10:30:45.135Z","dependency_job_id":null,"html_url":"https://github.com/sagiegurari/angular-number-input","commit_stats":null,"previous_names":[],"tags_count":82,"template":false,"template_full_name":null,"purl":"pkg:github/sagiegurari/angular-number-input","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sagiegurari%2Fangular-number-input","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sagiegurari%2Fangular-number-input/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sagiegurari%2Fangular-number-input/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sagiegurari%2Fangular-number-input/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sagiegurari","download_url":"https://codeload.github.com/sagiegurari/angular-number-input/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sagiegurari%2Fangular-number-input/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":261601480,"owners_count":23183092,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","angularjs-number","bower","html","number-input","web"],"created_at":"2024-10-14T04:26:50.853Z","updated_at":"2025-06-24T04:06:07.187Z","avatar_url":"https://github.com/sagiegurari.png","language":"JavaScript","readme":"# angular-number-input\n\n[![NPM Version](http://img.shields.io/npm/v/angular-number-input.svg?style=flat)](https://www.npmjs.org/package/angular-number-input) [![CI](https://github.com/sagiegurari/angular-number-input/workflows/CI/badge.svg?branch=master)](https://github.com/sagiegurari/angular-number-input/actions) [![Coverage Status](https://coveralls.io/repos/sagiegurari/angular-number-input/badge.svg)](https://coveralls.io/r/sagiegurari/angular-number-input) [![Known Vulnerabilities](https://snyk.io/test/github/sagiegurari/angular-number-input/badge.svg)](https://snyk.io/test/github/sagiegurari/angular-number-input) [![Inline docs](http://inch-ci.org/github/sagiegurari/angular-number-input.svg?branch=master)](http://inch-ci.org/github/sagiegurari/angular-number-input) [![License](https://img.shields.io/npm/l/angular-number-input.svg?style=flat)](https://github.com/sagiegurari/angular-number-input/blob/master/LICENSE)\n\n\u003e AngularJS number input directive\n\n* [Overview](#overview)\n* [Demo](https://sagiegurari.github.io/angular-number-input/)\n* [Usage](#usage)\n* [Installation](#installation)\n* [API Documentation](docs/api.md)\n* [Contributing](.github/CONTRIBUTING.md)\n* [Release History](#history)\n* [License](#license)\n\n\u003ca name=\"overview\"\u003e\u003c/a\u003e\n## Overview\nThe number-input is an angular directive which provides number validation, parsing and formatting capabilities\non any HTML element.\n\n## Demo\n[Live Demo](https://sagiegurari.github.io/angular-number-input/)\n\n\u003ca name=\"usage\"\u003e\u003c/a\u003e\n## Usage\nIn order to use the number-input directive you first must add the relevant dependencies:\n\n```html\n\u003cscript type=\"text/javascript\" src=\"angular.js\"\u003e\u003c/script\u003e\n\u003cscript type=\"text/javascript\" src=\"angular-number-input.js\"\u003e\u003c/script\u003e\n```\n\nNext you must define it as a dependency in your main angular module as follows:\n\n```js\nangular.module('exampleApp', [\n    'number-input'\n]);\n```\n\nNow you can use the directive in your HTML templates, for example:\n\n```html\n\u003cinput type=\"text\" class=\"number-input\"\n  ng-model=\"value\"\n  min=\"-100\"\n  max=\"100\"\n  step=\"0.5\"\n  validation=\"myNumberValidation\"\n  formatter=\"myNumberFormatter\"\n  parser=\"myNumberParser\"\u003e\n```\n\nIn case you have common parsing/formatting/validations/min/max/step you wish to use in many places in your application, you can create a service to implement those and provide it to the directive as follows:\n\n```html\n\u003cinput type=\"text\" class=\"number-input\"\n  ng-model=\"value\"\n  service=\"myMoneyService\"\u003e\n```\n\nAnd an example service:\n\n```js\nangular.module('moneyModule', []).service('myMoneyService', function () {\n    return {\n        create: function () {\n            return {\n                config: null, //will be populated by the directive with the config which holds the min/max/step/... values\n                min: 10,\n                max: 100,\n                step: 5,\n                format: function (value) {\n                    if (value) {\n                        value = '$' + value;\n                    }\n\n                    return value;\n                },\n                parse: function (value) {\n                    if (value) {\n                        if (value.charAt(0) === '$') {\n                            value = value.substring(1);\n                        }\n                    }\n\n                    value = Number(value);\n\n                    return value;\n                },\n                validate: function (modelValue, viewValue) {\n                    return true;\n                },\n                link: function (scope, element, attrs, ngModelCtrl) {\n                    //do some custom stuff on the directive instance like adding DOM event handling\n                    element.on('keydown', function ($event) {\n                        switch ($event.keyCode) {\n                        case $.ui.keyCode.ENTER:\n                            element.blur();\n                            break;\n                        }\n                    });\n                }\n            };\n        }\n    }\n});\n```\n\nIn case both service and HTML attributes provide a definition for same attributes (for example min, max, parser and so on...), the HTML attribute value will override the service provided value.\u003cbr\u003e\nIf the HTML provided value changes to undefined/null/invalid value, the service value will be used instead.\n\n\u003ca name=\"installation\"\u003e\u003c/a\u003e\n## Installation\nRun npm install in your project as follows:\n\n```sh\nnpm install --save angular-number-input\n```\n\n## API Documentation\nSee full docs at: [API Docs](docs/api.md)\n\n## Contributing\nSee [contributing guide](.github/CONTRIBUTING.md)\n\n\u003ca name=\"history\"\u003e\u003c/a\u003e\n## Release History\n\n| Date        | Version | Description |\n| ----------- | ------- | ----------- |\n| 2020-05-11  | v2.0.0  | Migrate to github actions, upgrade minimal node version and remove bower |\n| 2019-02-08  | v1.1.7  | Maintenance |\n| 2018-02-12  | v1.1.2  | Add support for step validations using big.js for more accurate calculations |\n| 2018-02-01  | v1.0.38 | Link function of the provided service will only be called once to prevent memory leaks |\n| 2016-07-11  | v0.0.27 | Service can now provide min/max/step values and template values override service values |\n| 2016-06-14  | v0.0.22 | Published via NPM (in addition to bower) |\n| 2016-05-17  | v0.0.14 | Directive element now listens to new number-input$update-model event |\n| 2016-05-15  | v0.0.11 | Redesign of service integration |\n| 2016-05-09  | v0.0.5  | 'service' is now string value and not binded to scope |\n| 2016-05-09  | v0.0.3  | Adding common service support |\n| 2016-05-08  | v0.0.3  | Initial release |\n\n\u003ca name=\"license\"\u003e\u003c/a\u003e\n## License\nDeveloped by Sagie Gur-Ari and licensed under the Apache 2 open source license.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsagiegurari%2Fangular-number-input","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsagiegurari%2Fangular-number-input","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsagiegurari%2Fangular-number-input/lists"}