从tinymce触发的MatDialog直到窗口调整大小才被初始化

Question

这个赏金已经结束。 这个问题的答案有资格获得+50声望奖励。 赏金宽限期将在2 小时后结束。 Jay正在从信誉良好的来源寻找答案。

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

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

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 + '">');
                  });
                });
            });
            }