从 tinymce 触发的 MatDialog 在 window 调整大小之前未初始化

Question

我正在尝试从 tinymce 自定义按钮打开 MatDialog，但是在我调整 window 大小之前，matdialog 没有被初始化。我知道这是由于该方法是在 tinymce init json 对象中编写的，因此导致问题但不知道该怎么做：

在组件class中，我是这样提到的：

tinyMceConfig: any = {
    menubar: false, plugins: ['advlist autolink lists link image charmap print preview hr anchor pagebreak','searchreplace wordcount visualblocks visualchars code fullscreen','insertdatetime media nonbreaking save table contextmenu directionality','emoticons template paste textcolor colorpicker textpattern'], toolbar1: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | code | link Upload',
    setup: (editor) => {
      editor.ui.registry.addButton('Upload', {
        icon: 'browse',
        onAction: ()=> {
          const dialogRef: MatDialogRef<any> = this.dialog.open(UploadmediaComponent, { width: '95vw', disableClose: true, panelClass: 'uploadPanel'});
            dialogRef.afterClosed().subscribe(res => {
              if (!res) {
                return;
              }
              res.forEach(image => {
                console.log(image.url);
                editor.insertContent(image.url);
              });
            });
        }
      });
    }
  };

在组件中：

<editor formControlName="popupText" name="popupText" apiKey="xxxx" 
                                    [init]="tinyMceConfig"></editor>

我进一步简化了这段代码并在 ngOnInit 中分离了设置部分，但这没有任何区别。

Answer 1

只是用 ngZone.run 包装对话框的初始化，它对我来说非常完美：

onAction: ()=> {
            this.ngZone.run(()=> {
              const dialogRef: MatDialogRef<any> = this.dialog.open(UploadmediaComponent, { 
                width: '95vw', disableClose: true, panelClass: 'uploadPanel'});
                dialogRef.afterClosed().subscribe(res => {
                  if (!res) {
                    return;
                  }
                  res.forEach(image => {
                    editor.insertContent('<img src="' + image.url + '">');
                  });
                });
            });
            }

从 tinymce 触发的 MatDialog 在 window 调整大小之前未初始化

MatDialog triggered from tinymce not getting initialized until window resize

javascript

tinymce

typescript

angular-material

angular