feat(popover): support passing template context (#2428)

* Fixes #1682 by adding a new @input for popover directive so that context can be passed when content is TemplateRef.
valor-software · Aug 21, 2017 · 38e562d · 38e562d
1 parent f398576
commit 38e562d
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/src/component-loader/component-loader.class.ts b/src/component-loader/component-loader.class.ts
@@ -104,13 +104,13 @@ export class ComponentLoader<T> {
   }
 
   // todo: appendChild to element or document.querySelector(this.container)
-  public show(opts: { content?: string | TemplateRef<any>, [key: string]: any } = {}): ComponentRef<T> {
+  public show(opts: { content?: string | TemplateRef<any>, context?: any, [key: string]: any } = {}): ComponentRef<T> {
     this._subscribePositioning();
     this._innerComponent = null;
 
     if (!this._componentRef) {
       this.onBeforeShow.emit();
-      this._contentRef = this._getContentRef(opts.content);
+      this._contentRef = this._getContentRef(opts.content, opts.context);
       const injector = ReflectiveInjector.resolveAndCreate(this._providers, this._injector);
 
       this._componentRef = this._componentFactory.create(injector, this._contentRef.nodes);
@@ -289,14 +289,15 @@ export class ComponentLoader<T> {
     this._zoneSubscription = null;
   }
 
-  private _getContentRef(content: string | TemplateRef<any> | any): ContentRef {
+  private _getContentRef(content: string | TemplateRef<any> | any, context?: any): ContentRef {
     if (!content) {
       return new ContentRef([]);
     }
 
     if (content instanceof TemplateRef) {
       if (this._viewContainerRef) {
-        const viewRef = this._viewContainerRef.createEmbeddedView<TemplateRef<T>>(content);
+        const viewRef = this._viewContainerRef.createEmbeddedView<TemplateRef<T>>(content, context);
+        viewRef.markForCheck();
         return new ContentRef([viewRef.rootNodes], viewRef);
       }
       const viewRef = content.createEmbeddedView({});

diff --git a/src/popover/popover.directive.ts b/src/popover/popover.directive.ts
@@ -15,6 +15,10 @@ export class PopoverDirective implements OnInit, OnDestroy {
    * Content to be displayed as popover.
    */
   @Input() public popover: string | TemplateRef<any>;
+  /**
+   * Context to be used if popover is a template.
+   */
+  @Input() public popoverContext: any;
   /**
    * Title of a popover.
    */
@@ -103,6 +107,7 @@ export class PopoverDirective implements OnInit, OnDestroy {
       .position({attachment: this.placement})
       .show({
         content: this.popover,
+        context: this.popoverContext,
         placement: this.placement,
         title: this.popoverTitle,
         containerClass: this.containerClass