@angular/cdk/portal#ComponentType TypeScript Examples

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;
  }

private attachDialogContent<T, D, R>(
    compOrTempRef: ComponentType<T> | TemplateRef<T>,
    dialogIns: DialogComponent,
    overlayRef: OverlayRef,
    config: DialogConfig<D>,
  ): DialogRef<T, R> {
    const dialogRef = new DialogRef<T, R>(
      overlayRef,
      dialogIns,
      this.scrollDispatcher,
      this.ngZone,
    );

    if (compOrTempRef instanceof TemplateRef) {
      dialogIns.attachTemplatePortal(
        new TemplatePortal(compOrTempRef, null, {
          $implicit: config.data,
        } as any),
      );
    } else {
      const injector = this.createInjector(config, dialogRef, dialogIns);
      const contentRef = dialogIns.attachComponentPortal<T>(
        new ComponentPortal(compOrTempRef, null, injector),
      );
      dialogRef.componentInstance = contentRef.instance;
    }
    return dialogRef;
  }

constructor(
    protected overlay: Overlay,
    protected injector: Injector,
    protected applicationRef: ApplicationRef,
    protected cfr: ComponentFactoryResolver,
    protected overlayPaneClassName: string,
    protected wrapperClass: ComponentType<Wrapper>,
    protected componentClass: ComponentType<Component>,
    protected globalConfig: MessageGlobalConfig,
  ) {
    this.initWrapperContainer();
  }

/**
     * get access to parent object's fields
     *
     * @param schemaChange  signal a change
     * @param name          the current property name (key)
     * @param schema        the current schema
     * @param parent        the parent's schema (required in order to change the order)
     * @param dialog        dialog service
     */
    constructor(
        private schemaChange: EventEmitter<void>, private name: string, private schema: Schema, private parent: Schema,
        private dialog: MatDialog, private component: ComponentType<any>) {
    }

/**
   * component constructor
   * @param http                        http client
   * @param componentFactoryResolver    allows dynamic components
   * @param service                     application service for registering components etc.
   * @param dialog                      dialog service
   */
  constructor(
    private http: HttpClient,
    private componentFactoryResolver: ComponentFactoryResolver,
    public service: JsonSchemaFormService,
    private dialog: MatDialog,
    @Inject(EDIT_DIALOG_TOKEN) private component: ComponentType<any>) { }

public getDialog<T, K>(component: ComponentType<T>, config?: MatDialogConfig<K>): MatDialogRef<T, any> {
    return this._dialog.open(component, config);
  }

protected componentClass: ComponentType<any> = TooltipComponent;

EDIT_DIALOG_TOKEN: InjectionToken<ComponentType<any>> =
    new InjectionToken<ComponentType<any>>('EDIT_DIALOG_TOKEN')

/** An input indicating the type of the header component, if set. */
  @Input() headerComponent: ComponentType<any>;

/** An input indicating the type of the custom header component for the calendar, if set. */
  @Input() calendarHeaderComponent: ComponentType<any>;

/** An input indicating the type of the header component, if set. */
  @Input() headerComponent: ComponentType<any>;

/** An input indicating the type of the custom header component for the calendar, if set. */
  @Input() calendarHeaderComponent: ComponentType<any>;