ng-virtual-keyboard

What is this?

Virtual Keyboard for Angular applications

See CHANGELOG.md

Install

Step 1: Install @protacon/ng-virtual-keyboard

$ npm install --save @protacon/ng-virtual-keyboard

Step 2: Import the module

Add NgVirtualKeyboardModule as an import in your app's root NgModule.

import { NgVirtualKeyboardModule }  from '@protacon/ng-virtual-keyboard';

@NgModule({
  ...
  imports: [
    ...
    NgVirtualKeyboardModule,
  ],
  ...
})
export class AppModule { }

Usage

Simple usage example

<input type="text" value=""
  ng-virtual-keyboard
  ng-virtual-keyboard-layout="alphanumeric"
  ng-virtual-keyboard-placeholder="Custom placeholder text"
  (ng-virtual-keyboard-close)="onClose()"
/>

Attribute	Description
ng-virtual-keyboard	Required to initialize Virtual Keyboard to specified input
ng-virtual-keyboard-layout	Used layout on keyboard, following keyboards are defaults that you can use alphanumeric, alphanumericNordic, extended, extendedNordic, numeric, phone
ng-virtual-keyboard-placeholder	Override placeholder text, if input has not any - or you want to override input placeholder value
ng-virtual-keyboard-close	Listener for keyboard closing event

Demo

https://by-pinja.github.io/ng-virtual-keyboard/

Local development

For easier local development, Docker can be used for compiling and testing the keyboard. To run virtual keyboard from local docker environment, execute following:

docker-compose up

After this is ready, navigate to http://localhost:4200/

To avoid installing node etc. locally, execute.sh can be used to exceute command with current version of supported container.

Lint example:

bash execute.sh yarn lint

Basically this is just a shorthand for docker run -it --rm -w /app -v ${PWD}/:/app node:12-alpine3.14 "$@"

License

The MIT License (MIT)

Copyright (c) 2017 Protacon