GithubHelp home page GithubHelp logo

cohenadair / angular.number-input Goto Github PK

View Code? Open in Web Editor NEW
21.0 3.0 7.0 263 KB

A number-only input element directive for AngularJS.

License: GNU General Public License v2.0

CSS 1.49% HTML 31.81% JavaScript 66.69%
javascript angularjs directives

angular.number-input's Introduction

Number Input for AngularJS

DEMO

A number-only input element directive for AngularJS.

Status

September 27th, 2017: Support for this project has been discontinued. Use at your own risk.

Requirements

Installation

  1. Include dist/number-input.min.js
  2. Use the <number-input></number-input> tag

Example

<number-input ng-model="model" 
			  max="24" 
			  min="0" 
			  step="1" 
			  start="10" 
			  hint="0 to 24 hours" 
			  hideHint="false" 
			  disableDecimal="true" 
			  decimalPlaces="0" 
			  prefix="*" 
			  postfix="%"></number-input>

or

opts = {
  max: 24,
  min: 0,
  step: 1,
  start: 10,
  hint: "0 to 24 hours",
  hideHint: false,
  disableDecimal: true,
  decimalPlaces: 0,
  prefix: "*",
  postfix: "%"
};
<number-input ng-model="model" options="opts"></number-input>

Options

Field Data type Default Required Attribute/Option Description
ngModel Number None Yes Attribute AngularJS model
start Number 0 No Both Initial input value
min Number -โˆž No Both Minimum input value
max Number โˆž No Both Maximum input value
step Number 1 No Both How much to increase/decrease by when the +/- buttons are pressed
hint String Depends on min/max values No Both Small text that appears below the input element
hideHint Boolean false No Both Hides the hint
disableDecimal Boolean false No Both Disables decimals from being typed
decimalPlaces Number # of decimals in step No Both Number of decimal places shown
prefix String None No Both An input prefix (i.e. $)
postfix String None No Both An input postfix (i.e. %)
options Object Empty No Both Options can be used instead of element attributes (attributes have priority)

Testing Locally

To test locally without using the minified version, have npm installed and use the following commands:

npm install http-server -g
http-server Workplace/angular.number-input/

Contributing

Feel free to send a pull request if you can improve something, or create an issue if you have any questions or problems.

License

Licensed under GNU GPL v2.

Enjoy!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.