From b4c3a0b53813f563581b6c10dafa926ed020c680 Mon Sep 17 00:00:00 2001 From: Karl Seamon Date: Wed, 22 Jan 2020 14:00:25 -0500 Subject: [PATCH] fix(popover-edit): Call markForCheck against row hover content when showing --- src/cdk-experimental/popover-edit/table-directives.ts | 2 ++ .../popover-edit-tab-out-mat-table-example.ts | 3 ++- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/cdk-experimental/popover-edit/table-directives.ts b/src/cdk-experimental/popover-edit/table-directives.ts index 3fc52ac7343f..e591ff379068 100644 --- a/src/cdk-experimental/popover-edit/table-directives.ts +++ b/src/cdk-experimental/popover-edit/table-directives.ts @@ -439,8 +439,10 @@ export class CdkRowHoverContent implements AfterViewInit, OnDestroy { if (!this.viewRef) { this.viewRef = this.viewContainerRef.createEmbeddedView(this.templateRef, {}); this.initElement(this.viewRef.rootNodes[0] as HTMLElement); + this.viewRef.markForCheck(); } else if (this.viewContainerRef.indexOf(this.viewRef) === -1) { this.viewContainerRef.insert(this.viewRef!); + this.viewRef.markForCheck(); } if (eventState === HoverContentState.ON) { diff --git a/src/components-examples/material-experimental/popover-edit/popover-edit-tab-out-mat-table/popover-edit-tab-out-mat-table-example.ts b/src/components-examples/material-experimental/popover-edit/popover-edit-tab-out-mat-table/popover-edit-tab-out-mat-table-example.ts index 43212fe53469..9a8d19f170e2 100644 --- a/src/components-examples/material-experimental/popover-edit/popover-edit-tab-out-mat-table/popover-edit-tab-out-mat-table-example.ts +++ b/src/components-examples/material-experimental/popover-edit/popover-edit-tab-out-mat-table/popover-edit-tab-out-mat-table-example.ts @@ -1,4 +1,4 @@ -import {Component} from '@angular/core'; +import {ChangeDetectionStrategy, Component} from '@angular/core'; import {DataSource} from '@angular/cdk/collections'; import {NgForm} from '@angular/forms'; import {BehaviorSubject, Observable} from 'rxjs'; @@ -40,6 +40,7 @@ const ELEMENT_DATA: PeriodicElement[] = [ selector: 'popover-edit-tab-out-mat-table-example', styleUrls: ['popover-edit-tab-out-mat-table-example.css'], templateUrl: 'popover-edit-tab-out-mat-table-example.html', + changeDetection: ChangeDetectionStrategy.OnPush, }) export class PopoverEditTabOutMatTableExample { displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];