# Understanding the "Expression has changed after it was checked" error

**URL:** <https://forum.ionicframework.com/t/understanding-the-expression-has-changed-after-it-was-checked-error/219294>\
**Category:** Ionic Angular\
**Created:** [January 11, 2022, 10:54pm UTC](https://forum.ionicframework.com/t/understanding-the-expression-has-changed-after-it-was-checked-error/219294 "2022-01-11T22:54:06Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![yellowkicks](https://avatars.discourse-cdn.com/v4/letter/y/b782af/32.png) [@yellowkicks](https://forum.ionicframework.com/u/yellowkicks)\
**Post date:** [January 11, 2022, 10:54pm UTC](https://forum.ionicframework.com/t/understanding-the-expression-has-changed-after-it-was-checked-error/219294/1 "2022-01-11T22:54:06Z")

</div>

I am receiving an error when trying to update the value of an item in my app.

This is the error:

```auto
ERROR Error: NG0100: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'false'. Current value: 'true'.

```

In my project, I have a list of items:

```auto
<ion-item-sliding *ngFor="let item of items" [id]="'item-' + item.id">
    <ion-item lines="full">
          <ion-label [class.strike]="item.checked" class="ion-padding ion-text-wrap">
                {{ item.title }}
           </ion-label>
           <ion-checkbox slot="start" [checked]="item.checked" mode="ios" (ionChange)="itemChecked(item)"></ion-checkbox>
    </ion-item>
    <ion-item-options side="end">
          <ion-item-option (click)="move(item)">Move</ion-item-option>
     </ion-item-options>
</ion-item-sliding>

```

In my move method, I attempt to set the values like this, before saving in my database:

```auto
async move(item: Item) {
    item.location = 'history'; //No issues with this
    item.checked = false; //Throws above error
    await this.firestore.updateItem(item);
}

```

No errors are thrown if I just update the `location`, but as soon as I attempt to update the `checked` in the `item`, then it throws the error above?

Any thoughts on what may be causing this error and what I could look at to try and correct the issue?

---

<div class="post-metadata">

**Author:** ![rapropos](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/rapropos/32/100227_2.png) [@rapropos](https://forum.ionicframework.com/u/rapropos)\
**Post date:** [January 11, 2022, 11:06pm UTC](https://forum.ionicframework.com/t/understanding-the-expression-has-changed-after-it-was-checked-error/219294/2 "2022-01-11T23:06:54Z")

</div>

What does `itemChecked()` look like?

---

<div class="post-metadata">

**Author:** ![yellowkicks](https://avatars.discourse-cdn.com/v4/letter/y/b782af/32.png) [@yellowkicks](https://forum.ionicframework.com/u/yellowkicks)\
**Post date:** [January 11, 2022, 11:36pm UTC](https://forum.ionicframework.com/t/understanding-the-expression-has-changed-after-it-was-checked-error/219294/3 "2022-01-11T23:36:36Z")

</div>

This is my `itemChecked` method. Instead of updating the entire item in firestore, it just updates one item in the object based on the key.

```auto
async itemChecked(item: Item) {
    item.checked = !item.checked;
    await this.firestore.updateItemKey(item, 'checked');
}

```

---

<div class="post-metadata">

**Author:** ![rapropos](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/rapropos/32/100227_2.png) [@rapropos](https://forum.ionicframework.com/u/rapropos)\
**Post date:** [January 11, 2022, 11:46pm UTC](https://forum.ionicframework.com/t/understanding-the-expression-has-changed-after-it-was-checked-error/219294/4 "2022-01-11T23:46:16Z")

</div>

The fundamental problem is that `checked` is getting modified multiple times within the same change detection cycle. One way you could try to debug it is to make `checked` have a custom setter function and put a breakpoint in it. It should get called at least twice quickly in succession in response to a click on the “move” before the NG0100 bites you. I’m speculating that this will be once from `move` and once from `itemChecked`.

---

<div class="post-metadata">

**Author:** ![yellowkicks](https://avatars.discourse-cdn.com/v4/letter/y/b782af/32.png) [@yellowkicks](https://forum.ionicframework.com/u/yellowkicks)\
**Post date:** [January 12, 2022, 1:30am UTC](https://forum.ionicframework.com/t/understanding-the-expression-has-changed-after-it-was-checked-error/219294/5 "2022-01-12T01:30:35Z")

</div>

Thanks for the detailed response. Just so I make sure I am on the same page, are you thinking that since both `move` and `itemChecked` are on the same element item (`ion-item-sliding`), that’s what’s causing the Expression error?

I’m not sure I am following your thoughts on the custom setter function, can you elaborate a little more so I could try that route too?

Much appreciated!

Edit: Additionally, I do notice this after I interact with the list:

 ![Screen Shot 2022-01-11 at 7.36.25 PM](https://global.discourse-cdn.com/ionicframework/original/3X/0/3/0315865c0cd837c0e98e80ea71cb86066d2e62b7.png)

After the initial load of the items (the first list.page.ts), I click on the an `itemChecked()` and it shows the result of the item (`true`) then it quickly loads the list two additional times.

---

<div class="post-metadata">

**Author:** ![rapropos](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/rapropos/32/100227_2.png) [@rapropos](https://forum.ionicframework.com/u/rapropos)\
**Post date:** [January 12, 2022, 4:37am UTC](https://forum.ionicframework.com/t/understanding-the-expression-has-changed-after-it-was-checked-error/219294/6 "2022-01-12T04:37:32Z")

</div>

> [@yellowkicks](#):
>
> are you thinking that since both `move` and `itemChecked` are on the same element item ( `ion-item-sliding` ), that’s what’s causing the Expression error?

Something along those lines.

> [@yellowkicks](#):
>
> I’m not sure I am following your thoughts on the custom setter function, can you elaborate a little more

[This](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/set).
