From 65a602f6cf6a7e522b270d42360eeb8faf3bbc89 Mon Sep 17 00:00:00 2001 From: Andrew Scott Date: Fri, 6 Mar 2020 11:59:54 -0800 Subject: [PATCH] =?UTF-8?q?fix(material-experimental/mdc-form-field):=20av?= =?UTF-8?q?oid=20expression=20ch=E2=80=A6=20(#18741)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit There is currently a bug in the Angular Framework that results in ExpressionChangedAfterItHasBeenChecked errors not throwing when they should for OnPush components. Becuase we modify a variable used in the template after it was already checked (in ngAfterViewInit), we need to trigger change detection manually or the change might not be picked up. --- src/material-experimental/mdc-form-field/form-field.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/material-experimental/mdc-form-field/form-field.ts b/src/material-experimental/mdc-form-field/form-field.ts index daf66bb68c2b..5c7a1bc1d286 100644 --- a/src/material-experimental/mdc-form-field/form-field.ts +++ b/src/material-experimental/mdc-form-field/form-field.ts @@ -330,6 +330,9 @@ export class MatFormField implements AfterViewInit, OnDestroy, AfterContentCheck this._refreshOutlineNotchWidth(); // Enable animations now. This ensures we don't animate on initial render. this._subscriptAnimationState = 'enter'; + // Because the above changes a value used in the template after it was checked, we need + // to trigger CD or the change might not be reflected if there is no other CD scheduled. + this._changeDetectorRef.detectChanges(); } ngAfterContentInit() {