Interesting! I would do something like that:
<div ng-view></div>
<div ng-controller="virtualKeyboardController()">
<virtual-keyboard></virtual-keyboard>
</div>
The <virtual-keyboard>
directive will replace the element with the right HTML (you could also use a ng-include
instead of a directive; I personally believe the directive is the better way here).
Then the virtualKeyboardController
will use a custom service that gives you some methods to:
- show the keyboard;
- hide the keyboard;
- do other keyboard stuff.
The service must then be injected inside every controller that could use a virtual keyboard and bind all the textarea
s to it (that's probably the annoying part, if your app is already done).
NOTE: I created a <div>
which contains the <virtual-keyboard>
only as an example, to avoid controllers' conflicts, but there may be a better solution; also adding a ng-if
to the parent <div>
you could do the show/hide check out of the directive.