/ Angular
@maskito/angular is a light-weighted library to use Maskito in an Angular-way. Prerequisites
To get the most out of this guide, you should review the topic "Core Concepts" first.
Write less code
- No need to query element from DOM. Just pass all required options to
[maskito]directive. - No need to worry about clean-ups. All created event listeners are automatically removed after element is detached from DOM.
Basic directive approach
Use it when you have direct access to native input element.
Nested input element
Pass a predicate to maskito to find input element for you, if you do not have a direct access to it.
By default maskito will try to find input/textarea by querying its host:
host.querySelector('input,textarea') so that might be sufficient. Use custom predicate if you need custom logic. Custom input
#See querying nested input in action
Default behavior is enough for Taiga UI inputs
Set value programmatically
# When directly on native input/textarea tag, MaskitoDirective formats value set programmatically with Angular forms.
Pipe
#Format arbitrary value with the same options
Custom unmask handler
# According to W3C specification, textfield value should always be only a string -type (not number -type, not object -type or etc.). However, you can sometimes need to store value without mask in Angular form control. This example demonstrates how easily any Angular Control Value Accessor (default one or any custom one from a third-party UI Kit) can be monkey-patched to achieve this goal.
Control value:1000.42
Maskito