As I said, everything works fine and I can page through the months back and forth.

npm/calendar

module gives a simple array of array of date objects for every week of the month, from Monday to Sunday. The thing is that the first and the last week can also include dates from the previous or the next month and so I want to check for these cases and display the name of the month, once. So I would have

October 31, November 1, 2, 3, [...], 30, December 1, 2, 3, 4

.

To do this check I added one line to the app.component.html, so it looks like this:

Subscriber.ts:238 EXCEPTION: Error in app/app.component.html:17:14 caused by: Expression has changed after it was checked. Previous value: 'true'. Current value: 'false'.

and I can't page through months anymore. The clicks are still being evaluated and a new array is being generated, but the view will not update. Oh, and strangely enough, also checkMonth seems to evaluate the dates as intended, it still doesn't display the names of the months - I just got pure dates, no month names.

The issue

The reason you got the message is because

You check the value of a property (like this.thisMonth)

You update the value of said property, thus changing it.

Angular in dev mode will run every check twice, to help you filter out possible bugs. (This fails in your case. Since you update a property on the class, if you run the checkMonth() function twice, it will yield two different results, one will be true, and the second will be false as you've already updated your value that you run the checks on.

In order to avoid the latter, you should separate the logic more (although I think the code you wrote makes perfect sense, and should be OK for production, but that's just not how Angular2 looks at it).

So instead of checking and setting properties "back and forth", you could for example write a function, that returns the same value, that's only based on the input parameter.

This will take your current weeks, and checks what the first occurences of each month are. Based on this, no matter how many times you run this code, the results will always be the same, as it will run independently from the rest of your application, or the application's state.

Email codedump link for Angular2: View updates when data changes, but not with ngif