fix(popover-edit): Call markForCheck against row hover content when s…

…howing (angular#18258)
yifange · Jan 30, 2020 · a86b8f9 · a86b8f9
1 parent c12ed17
commit a86b8f9
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 1 deletion.
diff --git 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/...tal/popover-edit/popover-edit-tab-out-mat-table/popover-edit-tab-out-mat-table-example.ts b/...tal/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'];