@angular/core#TemplateRef TypeScript Examples

openPopup(dialog: TemplateRef<any>, folderId = "", participantId = "") {
        if(folderId != ""){
          this.editedFolderId = folderId;
          this.editedFolderName = this.getFolderNameForId(folderId);
        }
        if(participantId != ""){
          this.editedParticipantId = participantId;
          this.editedParticipantName = this.getParticipantNameForId(participantId);
        }

        this.popupRef.push(this.dialog.open(dialog, { context: 'this is some additional data passed to dialog' }));
    }

open<T, D = any, R = any>(
    compOrTempRef: ComponentType<T> | TemplateRef<T>,
    config: DialogConfig<D> = null,
  ): DialogRef<T, R> {
    this.hiddenPrevDialog();

    config = { ...new DialogConfig(), ...config };

    const overlayRef = this.createOverlay(config);
    const dialogIns = this.attachDialog(overlayRef, config);
    const dialogRef = this.attachDialogContent<T, D, R>(
      compOrTempRef,
      dialogIns,
      overlayRef,
      config,
    );
    this.openDialogs.push(dialogRef);
    dialogRef.updatePosition().updateSize();
    dialogRef.afterClosed().subscribe(() => {
      this.removeDialog(dialogRef);
      this.showPrevDialog();
    });

    return dialogRef;
  }

// TODO(andrewseguin): Add an input for providing a switch function to determine
  //   if this template should be used.
  constructor(
    template: TemplateRef<any>,
    _differs: IterableDiffers,
    @Inject(DXC_RESULTSET_TABLE) @Optional() public _table?: any
  ) {
    super(template, _differs);
  }

public registerTemplate(key: string, template: TemplateRef<ItemContext>) {
        if (Trace.isEnabled()) {
            PagerLog(`registerTemplate for key: ${key}`);
        }

        if (!this._templateMap) {
            this._templateMap = new Map<string, KeyedTemplate>();
        }

        const keyedTemplate = {
            key,
            createView: this.getItemTemplateViewFactory(template)
        };

        this._templateMap.set(key, keyedTemplate);
    }

ngOnInit(): void {
    if (this.title instanceof TemplateRef) {
      this.isTitleTemplate = true;
    }
    if (this.isOpen) {
      if (!this._contentPortal && this._explicitContent) {
        this._contentPortal = new TemplatePortal(
          this._explicitContent,
          this._viewContainerRef
        );
      }
    }
  }

@ViewChild('connectTemplate')
    connectTemplate: TemplateRef<any>;

@ViewChild('connectTemplate')
    connectTemplate: TemplateRef<any>;

@ViewChild(TemplateRef, {static: true}) templateRef: TemplateRef<any>;

@ViewChildren('dropdownOptionTemplate') dropdownOptionsTemplates: QueryList<TemplateRef<unknown>>;

@ViewChild('EditorTemplate', { static: true })
  EditorTemplate: TemplateRef<any>;

@ContentChild(TemplateRef, { static: true }) public addonTemplate: TemplateRef<any>;

@ViewChild('slideContent')
    public slideContent: TemplateRef<any>;

constructor(public _template: TemplateRef<any>) {}

@ViewChild("ssoModalTemplate", { static: false })
  ssoModalTemplate: TemplateRef<any>;

@Input() headerTemplate: TemplateRef<any>;

constructor(
    private templateRef: TemplateRef<any>,
    private viewContainerRef: ViewContainerRef
  ) {}

open(dialog: TemplateRef<any>) {
        this.popupRef.push(this.dialog.open(dialog, { context: 'this is some additional data passed to dialog' }));
    }

@ViewChild('infoTemplateRef') private infoTemplateRef: TemplateRef<any>;

open2(dialog: TemplateRef<any>) {
    this.dialogService.open(
      dialog,
      { context: 'this is some additional data passed to dialog' });
  }

@ContentChild(AccordionItemContentDirective, {
    read: TemplateRef,
    static: true,
  })
  _lazyContentTpl: TemplateRef<unknown>;