Sampath
Sampath

Reputation: 65870

Thousands separator with Input mask

I'm going to use this mask with Ionic 3 app. I have setup the project for this.

.ts

 this.masks = {
      budget: ['(', /[1-9]/, /\d/, /\d/, ')', ' ', /\d/, /\d/, /\d/, '-', /\d/, /\d/, /\d/, /\d/],
    }

.html

   <ion-input type="number" [(ngModel)]="project.budget" [textMask]="{mask: 
 masks.budget}"></ion-input>

Q: Above mask is just a phone number one.Can you tell me how to do thousand separated input mask here?

Hope I can use below reg ex-pattern.But how can I apply it to a masks array?

^\d+|\d{1,3}(?:[,.]\d{3})*$

budget values are numeric.No decimals.e.g. 100,000, 25,000 like that.

Upvotes: 0

Views: 8121

Answers (1)

Sampath
Sampath

Reputation: 65870

We can easily do this task by using createNumberMask addon.

.ts

  const numberMask = createNumberMask({
      prefix: '',
      thousandsSeparatorSymbol: ','
    })
    this.masks = {
      budget: numberMask,
    }

Upvotes: 1

Related Questions