ng-numeric-keyboard
v1.0.1
Published
Number keyboard for mobile browsers For Angular
Downloads
174
Maintainers
Readme
This project was forked in numeric-keyboard
Demo
Usage
1. Install
npm install ng-numeric-keyboard --save
import NgNumericKeyboardModule
。
import { NgNumericKeyboardModule } from 'ng-numeric-keyboard';
@NgModule({
imports: [ BrowserModule, NgNumericKeyboardModule ],
declarations: [AppComponent],
bootstrap: [AppComponent]
})
export class AppModule { }
2. Template
<ng-numeric-input [layout]="'number'"
[entertext]="'Next'"
[placeholder]="'This is placeholder'"
[disabled]="false"
[(ngModel)]="data"
(enterpress)="onEnter()"
(ngModelChange)="onChange()"
(focus)="onInputFocus()"
(blur)="onInputBlur()">
</ng-numeric-input>
API
Frequently used API is below. See the link for more information
Inputs
| Name | Type | Default | Description |
| -------------------------- |---------- | ------------ | --------------- |
| layout
| string | number
| keyboard layout. Possible layouts are number
, tel
and phone
|
| entertext
| string | Enter
| the label of keyboard enter key |
| placeholder
| string | | the input component's placeholder |
| disabled
| boolean | false | disable the input component |
Outputs
| Name | Type | Description |
| ----------------------- | ----------------- | ----------- |
| ngModelChange()
| number | Emits when the enter key of keyboard is pressed |
| enterpress()
| void | Emits when the input's value changes |
| focus()
| void | Emits when called on focusing |
| blur()
| void | Emits when the input loses the focus |
Layouts
There are three built-in layouts called number
, tel
and phone
which can be used as a replacement of system keyboard.
number layout
tel layout
phone layout
Troubleshooting
Please follow this guidelines when reporting bugs and feature requests:
- Use GitHub Issues board to report bugs and feature requests (not our email address)
- Please always write steps to reproduce the error. That way we can focus on fixing the bug, not scratching our heads trying to reproduce it.
Thanks for understanding!
License
The MIT License (see the LICENSE file for the full text)