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

Virtual Keyboard for Angular applications
https://github.com/by-pinja/ng-virtual-keyboard

angular angular-material2 keyboard

Last synced: 5 months ago
JSON representation

Virtual Keyboard for Angular applications

• Host: GitHub
• URL: https://github.com/by-pinja/ng-virtual-keyboard
• Owner: by-pinja
• License: mit
• Created: 2017-03-30T08:03:59.000Z (about 9 years ago)
• Default Branch: master
• Last Pushed: 2023-10-11T00:33:59.000Z (over 2 years ago)
• Last Synced: 2025-10-08T12:02:00.116Z (8 months ago)
• Topics: angular, angular-material2, keyboard
• Language: TypeScript
• Homepage: https://protacon.github.io/ng-virtual-keyboard/
• Size: 8.69 MB
• Stars: 25
• Watchers: 9
• Forks: 44
• Open Issues: 19
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE
  • Codeowners: .github/CODEOWNERS

Awesome Lists containing this project

README

          
# ng-virtual-keyboard

[![MIT licensed](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)

[![npm version](https://badge.fury.io/js/%40protacon%2Fng-virtual-keyboard.svg)](https://badge.fury.io/js/%40protacon%2Fng-virtual-keyboard)

[![npm](https://img.shields.io/npm/dm/@protacon/ng-virtual-keyboard.svg)](https://www.npmjs.com/package/@protacon/ng-virtual-keyboard)

[![Dependency Status](https://david-dm.org/protacon/ng-virtual-keyboard.svg)](https://david-dm.org/protacon/ng-virtual-keyboard)

[![devDependency Status](https://david-dm.org/protacon/ng-virtual-keyboard/dev-status.svg)](https://david-dm.org/protacon/ng-virtual-keyboard#info=devDependencies)

## What is this?

Virtual Keyboard for Angular applications

[See CHANGELOG.md](CHANGELOG.md)

## Install

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

```bash

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

```

### Step 2: Import the module

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

```typescript

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

@NgModule({

  ...

  imports: [

    ...

    NgVirtualKeyboardModule,

  ],

  ...

})

export class AppModule { }

```

## Usage

Simple usage example

```html

```

| 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:

```bash

docker-compose up

```

After this is ready, navigate to [http://localhost:4200/](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

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)](LICENSE)

Copyright (c) 2017 Protacon