Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Multischema in custom theme throws ExpressionChangedAfterItHasBeenCheckedError #2815

Closed
camden-penn opened this issue Apr 26, 2021 · 5 comments
Labels

Comments

@camden-penn
Copy link

Description
When toggling between options in a multischema, an ExpressionChangedAfterItHasBeenCheckedError is thrown. Other changes to the data model do not throw this error. Calling a ChangeDetectorRef's markForChanges() in various places has so far failed to fix it. Is there something I've missed?

Minimal Reproduction
https://stackblitz.com/edit/ngx-formly-multischema-minimal?file=app/multischema.type.ts

Your Environment

  • Angular version: 10.2.5
  • Formly version: 5.10.18

Additional context
This issue originally surfaced while I was putting together a fairly complicated custom theme. The barebones theme in the reproduction implements as few components as necessary to build a multischema, and each component is as simple as I can keep it.

@aitboudad
Copy link
Member

I'm unable to reproduce it when toggling between options, it occurs only on the first run which is related to the usage of {{ model }} in the template, Am I missing something else?

@camden-penn
Copy link
Author

Hmm. What I get in the stackblitz is exactly one error per change between options, and no error on startup. If the behavior isn't consistent across stackblitz instances, that's even more confusing.

For example, here's the console log I get from the following actions:

  1. Select multischema option 2, get error
  2. Add "to test" to the multischema's input box, updates model, no errors
  3. Select multischema option 1, get error
    image

@camden-penn
Copy link
Author

The reason I noticed the issue in the first place is that the form's validity is also affected in the same way. As such, the error appears on a Submit button set to disable at the appropriate times.

As well, I did try adding ChangeDetectorRef.checkForChanges() or ChangeDetectorRef.markForCheck() at the following places, to no effect:

  • When the multichema selector's value changes.

  • When the model is updated in the outer form. It can be seen updating before the error appears, after all.

  • When the multischema sub-objects' values change.

@aitboudad
Copy link
Member

I'm able to reproduce it, looking for a fix!

@aitboudad
Copy link
Member

This issue has been fixed and released as part of v5.10.20 release.

Please let us know, in case you are still encountering a similar issue/problem.
Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Development

No branches or pull requests

2 participants