0.5.0 • Published 6 years ago
ng2-virtual-keyboard v0.5.0
ng2-virtual-keyboard
current version v0.5.0
Virtual Keyboard for Angular 6
NPM
Demo
Coming Soon
Docs
Coming Soon
Usage
- Install package
npm install ng2-virtual-keyboard
- You have to import BrowserAnimationsModule in your root module
- Import Ng2VirtualKeyboardModule
- To set theme colors inject Ng2VkService to component and set one of colors: 'blue', 'red', 'green', 'black', 'orange', 'custom \ with Ng2VkService.setThemeColor(color) method. With custom you have to provide \ your own styles with .custom class.
- Insert
<vk-keyboard></vk-keyboard>
somewhere in view. - Attach Toggle Directive - vkToggle to any element you want \
ex.
<button vkToggle>Toggle Keyboard</button>
- Attach Input Directive - vkInput to any input element you want \
ex.
<input type="text" vkInput>
\ or Textarea Directive - vkTextArea to textares \ ex.<textarea vkTextArea>
- Virtual Keyboard is working with many inputs and inserting values only to \ focused one. To switch focused input press Tab
- Virtual Keyboard could create selections with shift + arrows
- To open / close keyboard without vkToggle use toggleKeyboard, openKeyboard and closeKeyboard methods from Ng2VkService
- Set enter action:
- for all inputs - with setEnterAction(callback) method from Ng2VkService
- for one input - with (vkEnter) output property of vkInput and vkTextArea directives
- action for one input has higher priority
- callback argument and $event object from vkEnter are type of Ng2VkEnterEvent and contain input value and event object with before / after strings and carret position
- vkTextArea use enter action only with vkEnter, default action is new line