Angular 2 expression has changed after it was checked error as a result of scrollbar being added

Viewed 398

I have a getter function which returns the offsetWidth of part of a component. At some point the page populates with elements triggering a scrollbar to be added to the page. The scrollbar addition changes the layout of the page by a few pixels, and changes the width of my component which is set as width:100% in CSS. The layout change apparently occurs within the change detection cycle.

The problem is that my getter function then returns a different value because it's width has indeed changed along with the page layout change, and triggers the ExpressionChangedAfterItHasBeenCheckedError.

Here is my function:

get width() {
    return this.track.nativeElement.offsetWidth;
}

What is a way I can sidestep or suppress this error?

0 Answers
Related