ngx-mask

ngx-mask

Version 19.0.6
Published 3 months ago
390 kB
1 dependency
MIT license

Install

npm i ngx-mask

yarn add ngx-mask

pnpm add ngx-mask

Overview

awesome ngx mask

Index

Variables

variable INITIAL_CONFIG

const INITIAL_CONFIG: InjectionToken<NgxMaskConfig>;

variable initialConfig

const initialConfig: NgxMaskConfig;

variable NEW_CONFIG

const NEW_CONFIG: InjectionToken<NgxMaskConfig>;

variable NGX_MASK_CONFIG

const NGX_MASK_CONFIG: InjectionToken<NgxMaskConfig>;

variable timeMasks

const timeMasks: string[];

variable withoutValidation

const withoutValidation: string[];

Functions

function provideEnvironmentNgxMask

provideEnvironmentNgxMask: (
    configValue?: NgxMaskOptions | (() => NgxMaskOptions)
) => EnvironmentProviders;

function provideNgxMask

provideNgxMask: (
    configValue?: NgxMaskOptions | (() => NgxMaskOptions)
) => Provider[];

Classes

class NgxMaskDirective

class NgxMaskDirective implements ControlValueAccessor, OnChanges, Validator {}

property allowNegativeNumbers

allowNegativeNumbers: any;

property apm

apm: any;

property clearIfNotMatch

clearIfNotMatch: any;

property decimalMarker

decimalMarker: any;

property dropSpecialCharacters

dropSpecialCharacters: any;

property hiddenInput

hiddenInput: any;

property inputTransformFn

inputTransformFn: any;

property instantPrefix

instantPrefix: any;

property keepCharacterPositions

keepCharacterPositions: any;

property leadZero

leadZero: any;

property leadZeroDateTime

leadZeroDateTime: any;

property mask

mask: any;

property maskFilled

maskFilled: any;

property onChange

onChange: (_: any) => void;

property onTouch

onTouch: () => void;

property outputTransformFn

outputTransformFn: any;

property ɵdir

static ɵdir: i0.ɵɵDirectiveDeclaration<
    NgxMaskDirective,
    'input[mask], textarea[mask]',
    ['mask', 'ngxMask'],
    {
        mask: { alias: 'mask'; required: false; isSignal: true };
        specialCharacters: {
            alias: 'specialCharacters';
            required: false;
            isSignal: true;
        };
        patterns: { alias: 'patterns'; required: false; isSignal: true };
        prefix: { alias: 'prefix'; required: false; isSignal: true };
        suffix: { alias: 'suffix'; required: false; isSignal: true };
        thousandSeparator: {
            alias: 'thousandSeparator';
            required: false;
            isSignal: true;
        };
        decimalMarker: {
            alias: 'decimalMarker';
            required: false;
            isSignal: true;
        };
        dropSpecialCharacters: {
            alias: 'dropSpecialCharacters';
            required: false;
            isSignal: true;
        };
        hiddenInput: { alias: 'hiddenInput'; required: false; isSignal: true };
        showMaskTyped: {
            alias: 'showMaskTyped';
            required: false;
            isSignal: true;
        };
        placeHolderCharacter: {
            alias: 'placeHolderCharacter';
            required: false;
            isSignal: true;
        };
        shownMaskExpression: {
            alias: 'shownMaskExpression';
            required: false;
            isSignal: true;
        };
        clearIfNotMatch: {
            alias: 'clearIfNotMatch';
            required: false;
            isSignal: true;
        };
        validation: { alias: 'validation'; required: false; isSignal: true };
        separatorLimit: {
            alias: 'separatorLimit';
            required: false;
            isSignal: true;
        };
        allowNegativeNumbers: {
            alias: 'allowNegativeNumbers';
            required: false;
            isSignal: true;
        };
        leadZeroDateTime: {
            alias: 'leadZeroDateTime';
            required: false;
            isSignal: true;
        };
        leadZero: { alias: 'leadZero'; required: false; isSignal: true };
        triggerOnMaskChange: {
            alias: 'triggerOnMaskChange';
            required: false;
            isSignal: true;
        };
        apm: { alias: 'apm'; required: false; isSignal: true };
        inputTransformFn: {
            alias: 'inputTransformFn';
            required: false;
            isSignal: true;
        };
        outputTransformFn: {
            alias: 'outputTransformFn';
            required: false;
            isSignal: true;
        };
        keepCharacterPositions: {
            alias: 'keepCharacterPositions';
            required: false;
            isSignal: true;
        };
        instantPrefix: {
            alias: 'instantPrefix';
            required: false;
            isSignal: true;
        };
    },
    { maskFilled: 'maskFilled' },
    never,
    never,
    true,
    never
>;

property ɵfac

static ɵfac: i0.ɵɵFactoryDeclaration<NgxMaskDirective, never>;

property patterns

patterns: any;

property placeHolderCharacter

placeHolderCharacter: any;

property prefix

prefix: any;

property separatorLimit

separatorLimit: any;

property showMaskTyped

showMaskTyped: any;

property shownMaskExpression

shownMaskExpression: any;

property specialCharacters

specialCharacters: any;

property suffix

suffix: any;

property thousandSeparator

thousandSeparator: any;

property triggerOnMaskChange

triggerOnMaskChange: any;

property validation

validation: any;

method checkSelectionOnDeletion

checkSelectionOnDeletion: (el: HTMLInputElement) => void;

method ngOnChanges

ngOnChanges: (changes: SimpleChanges) => void;

method onBlur

onBlur: (e: CustomKeyboardEvent) => void;

method onClick

onClick: (e: MouseEvent | CustomKeyboardEvent) => void;

method onCompositionEnd

onCompositionEnd: (e: CustomKeyboardEvent) => void;

method onCompositionStart

onCompositionStart: () => void;

method onFocus

onFocus: () => void;

method onInput

onInput: (e: CustomKeyboardEvent) => void;

method onKeyDown

onKeyDown: (e: CustomKeyboardEvent) => void;

method onModelChange

onModelChange: (value: string | undefined | null | number) => void;

method onPaste

onPaste: () => void;

method registerOnChange

registerOnChange: (fn: typeof this.onChange) => void;

method registerOnTouched

registerOnTouched: (fn: typeof this.onTouch) => void;

method setDisabledState

setDisabledState: (isDisabled: boolean) => void;

method validate

validate: ({ value }: FormControl) => ValidationErrors | null;

method writeValue

writeValue: (controlValue: unknown) => Promise<void>;

class NgxMaskPipe

class NgxMaskPipe implements PipeTransform {}

property ɵfac

static ɵfac: i0.ɵɵFactoryDeclaration<NgxMaskPipe, never>;

property ɵpipe

static ɵpipe: i0.ɵɵPipeDeclaration<NgxMaskPipe, 'mask', true>;

method transform

transform: (
    value: string | number,
    mask: string,
    { patterns, ...config }?: Partial<NgxMaskConfig>
) => string;

class NgxMaskService

class NgxMaskService extends NgxMaskApplierService {}

property currentValue

currentValue: string;

property isNumberValue

isNumberValue: boolean;

property maskChanged

maskChanged: boolean;

property maskExpressionArray

maskExpressionArray: string[];

property maskIsShown

maskIsShown: string;

property onChange

onChange: (_: any) => void;

property ɵfac

static ɵfac: i0.ɵɵFactoryDeclaration<NgxMaskService, never>;

property ɵprov

static ɵprov: i0.ɵɵInjectableDeclaration<NgxMaskService>;

property previousValue

previousValue: string;

property selEnd

selEnd: number;

property selStart

selStart: number;

property triggerOnMaskChange

triggerOnMaskChange: boolean;

property writingValue

writingValue: boolean;

method applyMask

applyMask: (
    inputValue: string,
    maskExpression: string,
    position?: number,
    justPasted?: boolean,
    backspaced?: boolean,
    cb?: (...args: any[]) => any
) => string;

method applyValueChanges

applyValueChanges: (
    position: number,
    justPasted: boolean,
    backspaced: boolean,
    cb?: (...args: any[]) => any
) => void;

method checkDropSpecialCharAmount

checkDropSpecialCharAmount: (mask: string) => number;

method clearIfNotMatchFn

clearIfNotMatchFn: () => void;

method currentLocaleDecimalMarker

currentLocaleDecimalMarker: () => string;

method getActualValue

getActualValue: (res: string) => string;

method hideInput

hideInput: (inputValue: string, maskExpression: string) => string;

method numberToString

numberToString: (value: number | string) => string;

method removeMask

removeMask: (inputValue: string) => string;

method shiftTypedSymbols

shiftTypedSymbols: (inputValue: string) => string;

method showMaskInInput

showMaskInInput: (inputVal?: string) => string;

Type Aliases

type InputTransformFn

type InputTransformFn = (value: unknown) => string | number;

type NgxMaskConfig

type NgxMaskConfig = {
    suffix: string;
    prefix: string;
    thousandSeparator: string;
    decimalMarker: '.' | ',' | ['.', ','];
    clearIfNotMatch: boolean;
    showMaskTyped: boolean;
    placeHolderCharacter: string;
    shownMaskExpression: string;
    specialCharacters: string[] | readonly string[];
    dropSpecialCharacters: boolean | string[] | readonly string[];
    hiddenInput: boolean;
    validation: boolean;
    instantPrefix: boolean;
    separatorLimit: string;
    apm: boolean;
    allowNegativeNumbers: boolean;
    leadZeroDateTime: boolean;
    leadZero: boolean;
    triggerOnMaskChange: boolean;
    keepCharacterPositions: boolean;
    inputTransformFn: InputTransformFn;
    outputTransformFn: OutputTransformFn;
    maskFilled: EventEmitter<void>;
    patterns: Record<
        string,
        {
            pattern: RegExp;
            optional?: boolean;
            symbol?: string;
        }
    >;
};

type NgxMaskOptions

type NgxMaskOptions = Partial<NgxMaskConfig>;

type OutputTransformFn

type OutputTransformFn = (value: string | number | undefined | null) => unknown;

Package Files (6)

Dependencies (1)

tslib

Dev Dependencies (0)

No dev dependencies.

Peer Dependencies (3)

Badge

To add a badge like this oneto your package's README, use the codes available below.

You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/ngx-mask.

Markdown

[![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/ngx-mask)

HTML

<a href="https://www.jsdocs.io/package/ngx-mask"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>

Updated 3 months ago.
Package analyzed in 3687 ms.
Missing or incorrect documentation? Open an issue for this package.