This project was generated with Angular CLI version 9.1.0.
If you like or are using this project please give it a star here. Thanks!
- Insert numbers only.
- Numbers with mask so it is can use as password.
- Period can use.
- Hide display if you want.
- Maximum length for input string.
- Maximum number can set.
- Angular
^9.0.0
npm install ngx-keypad --saveImport the component modules you want to use into your app.module.ts file and feature modules.
import {NgxKeypadModule} from 'ngx-keypad';
@NgModule({
imports: [ NgxKeypadModule ]
})
export class AppModule {
}In your template write this code.
<keypad [showPeriod]="true" [isPassword]="false" [(data)]="result"></keypad>| Property | Description | Type | Default |
|---|---|---|---|
| [showDisplay] | Show Display or not | boolean | true |
| [showPeriod] | Show period button or not | boolean | true |
| [isPassword] | Write asterisk in the field | boolean | false |
| [maxLength] | Not allow more length than this max, null is unlimited | number | null |
| [maxNumber] | Not allow more number than this max, null is unlimited | number | null |
| [background] | Component background | string | '#ccc' |
| [width] | Component width can be for ex 400px | string | '100%' |
| [padding] | Component padding can be for ex 20px | string | '10px' |
| [(data)] | Data input and output | string | '' |
$ git clone [email protected]:ShadyNagy/ngx-keypad.git
$ cd ngx-keypad
$ npm install
$ npm run build ngx-keypad -- --prod
$ npm run start
We welcome all contributions. Please read our CONTRIBUTING.md first. You can submit any ideas as pull requests or as GitHub issues.
We list some users here, if your company or product uses ngx-keypad, let us know here!