[angular1] createNumberMask + conformToMask

[bmsdave]

Hi, when i use:

import createNumberMask from 'text-mask-addons/dist/createNumberMask';
import {conformToMask} from 'angular1-text-mask';

const numberMask = createNumberMask({
    prefix: '',
    suffix: '',
    thousandsSeparatorSymbol: ' ',
    decimalSymbol: ',',
    decimalLimit: 4,
    allowDecimal: true,
    integerLimit: 15
});

var conformedPhoneNumber = conformToMask(
    '123321',
    numberMask,
    {guide: false}
);

I get error

TypeError: e.indexOf is not a function
    at n (angular1TextMask.js:120)

file angular1TextMask.js is uglify, and i don't get any debug info.

How to debug this package [angular1-text-mask]?

[lozjackson]

The mask provided to conformToMask should be an array. The returned value from createNumberMask is a function. The function needs to be run, and the return value of that would be the array you need to pass to conformToMask.

const numberMask = createNumberMask({
    prefix: '',
    suffix: '',
    thousandsSeparatorSymbol: ' ',
    decimalSymbol: ',',
    decimalLimit: 4,
    allowDecimal: true,
    integerLimit: 15
});

var mask = numberMask('123321'), // <- need to run the function, passing the rawValue

var conformedPhoneNumber = conformToMask(
    '123321',
    mask,
    {guide: false}
);

Hope that helps

[bmsdave]

@lozjackson, if i use decimal as "123.123", numberMask function return array with '[]', i remove this and everything work good. Thx!

[renatho]

@lozjackson and @bmsdave I have the same issue using Vanilla Text Mask.
Versions:
"text-mask-addons": "^3.5.0"
"vanilla-text-mask": "^5.0.1"

Using the example above, to the number 123321.12 it returns: 'R$ 12.332.112[],[]' (I lost the decimals)

It happens only with the conformToMask. In the input it works fine.

[thedamon]

I was getting this as well ($12,332,112[].[]) when passing requireDecimal to createNumberMask(val) and using it with conformToMask(). I don't need it for my current application... but it definitely doesn't seem right.

[adamdport]

There is a StackOverflow question about using decimals with conformToMask().

let percentMask = createNumberMask({
    prefix: '',
    suffix: '%',
    allowDecimal: true
});

let mask = percentMask('4.5');

let conformed = conformToMask('4.5', mask, {guide:false});

This throws Cannot read property 'test' of undefined.. Works fine with whole numbers. Seems like a bug to me. Anyone have any workarounds or ideas?

[adamdport]

In the above example, placeholder is "_[].[]_%" (8 characters) and mask is [/\d/, "[]", ".", "[]", /\d/, "%"] (6 characters). We loop over the placeholder and use the current placeholder index on mask. When i becomes 6, mask[6] is undefined, and we blow up.

@lozjackson any ideas?

[adamdport]

If I remove the []s from my mask, conformToMask works fine. Stepping through the createNumberMask code reveals that these are "caret traps". Perhaps we should add a line to conformToMask to remove them all before proceeding?

As a workaround for now, this seems to resolve the issue for me:

let percentMask = createNumberMask({
    prefix: '',
    suffix: '%',
    allowDecimal: true
});

let mask = percentMask('4.5');
mask = mask.filter((val) => val != '[]');   // <-- this removes the '[]' elements

let conformed = conformToMask('4.5', mask, {guide:false});