ryanehrler / ngx-mask-ionic

ngx-mask fork adapted to work with Ionic
14 stars 19 forks source link

Patterns not applied in formControl #8

Open lcaprini opened 4 years ago

lcaprini commented 4 years ago

I'm using a formBuilder in a ion-input where I also use a custom mask with custom pattern in order to create and edit a contact in a address book:

<form [formGroup]="contactForm">
    <ion-input
        formControlName="name"
        type="text"
        mask="C{40}"
        [patterns]="maskPatterns"
        maxlength="40"
        required>
    </ion-input>
</form>
public maskPatterns = {
    ...initialConfig.patterns,
    C: { pattern: new RegExp('[a-zA-Z 0-9\/\?\:\(\)\'\.\,\+\-]') },
    P: { pattern: new RegExp('[.,]') }
}

this.contactForm = this.formBuilder.group({
    name: [
        this.contact.name,
        Validators.compose([
            Validators.required,
                Validators.maxLength(40)
        ])
    ]
});

If the initial value of this.contact.name is not empty, the input was cleared.

I debugged a little bit your code and seems that the customPattern object inside the MaskApplierService is undefined when the first check runs the _checkSymbolMask method during the loading phase. In the following input changes the customPattern are filled with che new C and P pattern.

There is a way to force the module to set the custom pattern before the first check?

Thanks, --Luca