How to open a TinyMCE 5 dialog, what contains an Angular 10 component as body content?

I try to open a TinyMCE 5 dialog, what contains an Angular 10 component as body content.

I tried this code, but I'm stucked:

// tslint:disable: object-literal-key-quotes
import { Component, Input, ViewChild } from '@angular/core';
import { PhotoalbumComponent } from 'src/app/components/photoalbum/photoalbum.component';

declare let tinymce: any;

@Component({
  selector: 'app-tinymce-editor',
  templateUrl: './tinymce-editor.component.html',
  styleUrls: ['./tinymce-editor.component.css']
})
export class TinymceEditorComponent {
  @ViewChild(PhotoalbumComponent) photoalbum: PhotoalbumComponent;

  myContent = '';
  editor: any;
  options = {
    setup(editor: any): void {
      editor.ui.registry.addButton('myimage', {
        icon: 'image',
        onAction(): void {
          editor.execCommand('openImageDialog', false, null);
        }
      });

      editor.addCommand('openImageDialog', (ui: any, v: any) => {
        editor.windowManager.open({
          size: 'large',
          title: 'Images',
          body: {
            type: 'panel',
            items: [
              {
                type: 'htmlpanel',
                html: this.photoalbum,
              }
            ]
          },
          buttons: [],
        });
      });
    },
  };
}

In tinymce-editor.component.html file:

<editor apiKey="myApiKey" [init]="options" [(ngModel)]="myContent"></editor>

Is there any best practice or suggestion how to show a component's generated content in the dialog's body or what I need to read to step forward?

TinyMCE doesn't support rendering custom UI directly in the dialogs due to primarily CSS cascading issues. For these more advanced use-cases you can use the URL dialog type which renders the dialog body content inside a iframe