Initial or set value with IMask to edit data

91 Views Asked by At

I am using Angular with Imask. I already success for set input mask in component.

addcost.ts

export class AddCost {
 idadd: number;
 wrap: number;
 post: number;
}

addcost.component.ts

 import { IMask } from "angular-imask";

 export class AddCostComponent {
    numberMask = { mask: IMask.MaskedNumber, thousandsSeparator: "," };
 }

addcost.component.html

    <input
      #wrap
      matInput
      [(ngModel)]="addcost.wrap"
      [imask]="numberMask"
    />

Already success, number with thousand separator and save it in database

enter image description here

Then I will change the data and click the edit button, and show dialog, but the data is not shown. I know this is because Imask using string, not the number type data. How to solve this? I am not sure to change type wrap from number to any ?

Edit button

   public editData(item: AddCost): void {
     this.dialogRef = this.dialog.open(this.myDialog, {
     autoFocus: false,
     height: "300px",
     width: "400px",
     panelClass: "custom-dialog-container",
    });
    setTimeout(() => {
     this.wrap.nativeElement.focus();
     }, 1000);


     this.addcost.idadd = item.idadd;
     this.addcost.wrap = item.wrap; --> not show data
     this.addcost.post = item.post; --> not show data

  }
0

There are 0 best solutions below