# \[solved\] Ngmodel input doesn't update when it's changed

**URL:** <https://forum.ionicframework.com/t/solved-ngmodel-input-doesnt-update-when-its-changed/122271>\
**Category:** ionic-v3\
**Created:** [February 21, 2018, 10:12pm UTC](https://forum.ionicframework.com/t/solved-ngmodel-input-doesnt-update-when-its-changed/122271 "2018-02-21T22:12:08Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Akgul](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@Akgul](https://forum.ionicframework.com/u/Akgul)\
**Post date:** [February 21, 2018, 10:12pm UTC](https://forum.ionicframework.com/t/solved-ngmodel-input-doesnt-update-when-its-changed/122271/1 "2018-02-21T22:12:08Z")

</div>

Hello. I’m trying to allow user input only 2 decimal numbers after dot like (43.448 == 43.44) so I created an input with the ngModel and binded to ngModelChange function

```auto
<ion-input type="text" placeholder="100" [(ngModel)]="miktar" (ngModelChange)="onMiktarChange($event)" >
</ion-input>`

```

```auto
  miktar: String;
  onMiktarChange(num){
    var decimalCheck = [];
    decimalCheck = num.toString().split('.');
    if(decimalCheck[1] !== undefined){
      decimalCheck[1] = decimalCheck[1].slice(0,2);
      num = decimalCheck[0] + '.' + decimalCheck[1];
      this.miktar = num;
      alert(this.miktar);
    }
  }

```

I create `this.miktar` as a variable and update it with the two digit decimal number when the user enters the third. This logic works fine. I get with `alert(this.miktar);`` 44.54` like I want when I hit `44.546`. But input doesn’t update and It shows me `44.546` . So I can’t prevent user to enter the third digit.

I think I need a different solution. Any ideas ? Thank you :’)

---

<div class="post-metadata">

**Author:** ![jaydz](https://avatars.discourse-cdn.com/v4/letter/j/858c86/32.png) [@jaydz](https://forum.ionicframework.com/u/jaydz)\
**Post date:** [February 22, 2018, 4:10am UTC](https://forum.ionicframework.com/t/solved-ngmodel-input-doesnt-update-when-its-changed/122271/2 "2018-02-22T04:10:01Z")

</div>

Try

```auto
(ionChange)

```

Instead of

```auto
(ngModelChange)

```

---

<div class="post-metadata">

**Author:** ![Akgul](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@Akgul](https://forum.ionicframework.com/u/Akgul)\
**Post date:** [February 22, 2018, 8:09am UTC](https://forum.ionicframework.com/t/solved-ngmodel-input-doesnt-update-when-its-changed/122271/3 "2018-02-22T08:09:23Z")

</div>

I tried `(ionChange)` but it doesn’t work. What is difference between them ?

---

<div class="post-metadata">

**Author:** ![jaydz](https://avatars.discourse-cdn.com/v4/letter/j/858c86/32.png) [@jaydz](https://forum.ionicframework.com/u/jaydz)\
**Post date:** [February 22, 2018, 9:47am UTC](https://forum.ionicframework.com/t/solved-ngmodel-input-doesnt-update-when-its-changed/122271/4 "2018-02-22T09:47:30Z")

</div>

Actually it may be

```auto
(ionInput)=“myFunction($event)” >

```

I haven’t actually used Ionic in a while. The difference is ionInput will fire on every change and will be current.

Ionic doesn’t always follow angular directives exactly. This is one of those times I believe.

Unless I’m misunderstanding your need, this should help.

---

<div class="post-metadata">

**Author:** ![ahmeddev](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/ahmeddev/32/124474_2.png) [@ahmeddev](https://forum.ionicframework.com/u/ahmeddev)\
**Post date:** [February 22, 2018, 11:57am UTC](https://forum.ionicframework.com/t/solved-ngmodel-input-doesnt-update-when-its-changed/122271/5 "2018-02-22T11:57:17Z")

</div>

try

```auto
(keyup)

```

or

```auto
(keydown)

```

---

<div class="post-metadata">

**Author:** ![felix9607](https://avatars.discourse-cdn.com/v4/letter/f/0ea827/32.png) [@felix9607](https://forum.ionicframework.com/u/felix9607)\
**Post date:** [February 22, 2018, 12:37pm UTC](https://forum.ionicframework.com/t/solved-ngmodel-input-doesnt-update-when-its-changed/122271/6 "2018-02-22T12:37:48Z")

</div>

Try NgZone [https://angular.io/api/core/NgZone](https://angular.io/api/core/NgZone)

```auto
this.zone.run(()=>{
this.miktar = num;
});

```

this might be enough, or execute the whole onchange function in the Zone.

---

<div class="post-metadata">

**Author:** ![Akgul](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@Akgul](https://forum.ionicframework.com/u/Akgul)\
**Post date:** [February 23, 2018, 8:44am UTC](https://forum.ionicframework.com/t/solved-ngmodel-input-doesnt-update-when-its-changed/122271/7 "2018-02-23T08:44:22Z")

</div>

I solved the issue with `DecimalPipe` and `ChangeDetectorRef`

```auto
onMiktarChange(num){
    this.cdRef.detectChanges();
    var decimalCheck = [];
    decimalCheck = num.toString().split('.');
    if(decimalCheck[1] !== undefined){
      decimalCheck[1] = decimalCheck[1].slice(0,2);
      num = decimalCheck[0] + '.' + decimalCheck[1];
      this.miktar = num;
      return this.decimalPipe.transform(this.miktar, '1.1-2');
    }
  }

```

This worked for me. Thanks for all answers :’)

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [July 19, 2021, 9:49pm UTC](https://forum.ionicframework.com/t/solved-ngmodel-input-doesnt-update-when-its-changed/122271/8 "2021-07-19T21:49:54Z")

</div>

Closed on July 19, 2021, 9:49pm UTC


