catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/panel-tab.component.ts

   1 import { NgModule, Component, Compiler, ViewContainerRef, ViewChild, Input, ComponentRef, ComponentFactoryResolver, ChangeDetectorRef } from '@angular/core';
   2 import {Component as TopologyTemplate} from "app/models";
   3 import { SdcUiServices } from "onap-ui-angular";
   4
   5 // Helper component to add dynamic tabs
   6 @Component({
   7   selector: 'panel-tab',
   8   template: `<div #content></div>`
   9 })
  10 export class PanelTabComponent {
  11   @ViewChild('content', { read: ViewContainerRef }) content;
  12   @Input() isActive:boolean;
  13   @Input() panelTabType;
  14   @Input() input;
  15   @Input() isViewOnly:boolean;
  16   @Input() component:TopologyTemplate;
  17   @Input() componentType;
  18   cmpRef: ComponentRef<any>;
  19   private isViewInitialized: boolean = false;
  20
  21   constructor(private componentFactoryResolver: ComponentFactoryResolver,
  22     private cdRef: ChangeDetectorRef) { }
  23
  24   updateComponent() {
  25     if (!this.isViewInitialized || !this.isActive) {
  26       return;
  27     }
  28     if (this.cmpRef) {
  29       this.cmpRef.destroy();
  30     }
  31
  32     let factory = this.componentFactoryResolver.resolveComponentFactory(this.panelTabType);
  33     this.cmpRef = this.content.createComponent(factory);
  34     this.cmpRef.instance.input = this.input;
  35     this.cmpRef.instance.isViewOnly = this.isViewOnly;
  36     this.cmpRef.instance.component = this.component;
  37     this.cmpRef.instance.componentType = this.componentType;
  38     this.cdRef.detectChanges();
  39   }
  40
  41   ngOnChanges() {
  42     this.updateComponent();
  43   }
  44
  45   ngAfterViewInit() {
  46     this.isViewInitialized = true;
  47     this.updateComponent();
  48   }
  49
  50   ngOnDestroy() {
  51     if (this.cmpRef) {
  52       this.cmpRef.destroy();
  53     }
  54   }
  55 }