Angular 4 ExpressionChangedAfterItHasBeenCheckedError

Question

in ParentComponent =>

ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: \'\'. Current value         


        

Answer 1

In my case, I was changing the state of my data--this answer requires you to read AngularInDepth.com explanation of digest cycle -- inside the html level, all I had to do was change the way I was handling the data like so:

{{event.subjects.pop()}}

into

{{event.subjects[0]}}

Summary: instead of popping--which returns and remove the last element of an array thus changing the state of my data-- I used the normal way of getting my data without changing its state thus preventing the exception.