Expression Changed After It Has Been Checked Error

I am getting an ExpressionChangedAfterItHasBeenCheckedError reported when I add the following element to my form

<mbsc-input [(ngModel)]="lessonDuration" mbsc-timespan [mbsc-options]="timespanSettings">Duration</mbsc-input>

I have other <mbsc-input> elements in my form that do not cause an issue, and if I comment this line out, all is ok.

I have tried setting lessonDuration to a fixed value in my class, but still get the same issue.

This is what gets reported in the console

If I set a breakpoint at core.js:7589 I get following chrome debug info

Any ideas ?

Hi Dave,

Thanks for the question. You can actually use the <mbsc-timespan> component (which should be the recommended way), that will have the same results as the mbsc-input with the timespan directive. Also makes the code a bit more readable.

<mbsc-timespan [(ngModel)]="lessonDuration" [options]="timespanSettings">Duration</mbsc-timespan>

Please let me know if this works!


1 Like

Thanks Zoli, that works great - no more errors.

I will convert all my <mbsc-inputs> into their equivalent directives.