@ng-dl/numeric-input
Version:
override browser's default behavior & localization on numeric inputs
78 lines (54 loc) • 4.11 kB
Markdown
# Numeric Input Directive
Sync browsers' behavior and localization on numeric inputs.
### Demo
[](https://stackblitz.com/github/danieliverant/ng-dl)
[](https://codesandbox.io/s/numeric-input-demo-x6vsw?fontsize=14&hidenavigation=1&theme=dark)
## Installation
Install with [NPM](https://www.npmjs.com/get-npm):
[](https://badge.fury.io/js/%40ng-dl%2Fnumeric-input)
```bash
npm i @ng-dl/numeric-input
```
## Usage
```ts
import { NumericInputModule } from '@ng-dl/numeric-input';
@NgModule({
...,
imports: [..., NumericInputModule]
})
export class AppModule { }
```
Override default browser locale with any [supported locale](https://developer.chrome.com/webstore/i18n#localeTable).
```ts
import { NumericInputModule, NUMERIC_INPUT_LOCALE } from '@ng-dl/numeric-input';
@NgModule({
...,
imports: [..., NumericInputModule],
providers: [...,
{
provide: NUMERIC_INPUT_LOCALE,
useValue: 'my-locale' | ['array-of-locales']
}
]
})
export class AppModule { }
```
#### NOTICE:
> NUMERIC_INPUT_LOCALE accepts an array of locales to support multiple decimal separators - to enable comma and a dot, for example, we can provide ['nl-nl', 'en-us'].
> For formatting the first locale will be used.
#### Apply the directive:
```html
<input dlNumericInput/>
```
### Properties:
Name | Description | Example
------------ | ------------- | -------------
`@Input() min: number` | The minumum valid value | 1
`@Input() max: number` | The maximum valid value | 100
`@Output() localized: EventEmitter<string>` | Localized number as a string | '١٢٣٫٤٥'
## Contributing
Pull requests are welcome. Suggestions are welcome.
For major changes, please open an issue first to discuss what you would like to change.
Please make sure to update tests as appropriate.
## License
[MIT](https://github.com/Danieliverant/ng-dl/blob/master/projects/numeric-input/LICENSE)