Получение плагина CKEditor 4 для общения с вмещающим угловым компонентом

Question

У меня есть CKEditor 4 , работающий в простом Angular 8 приложении. Теперь я хотел бы настроить CKEditor 4, то есть добавить некоторые пользовательские функции. Для этого я сначала следовал инструкциям на Создание плагина CKEditor в 20 строках кода , чтобы создать пример плагина временной метки. Это сработало.

Теперь я хотел бы узнать, могу ли я вызывать / получать доступ / отправлять сообщения вмещающему угловому компоненту из exec метода CKEditor4 Плагин . Я открыт для любых идей.

Моя первоначальная попытка заключается в отправке пользовательского события из плагина и создании @HostListener внутри охватывающего компонента Angular. Мой код выглядит так:

app.component.ts:

import { Component, HostListener } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  textContent: String;

  @HostListener('noteevent') onEditorCommand() {
    console.log("Received Editor onEditorCommand()");
  }

}

app.component.html:

<div id="note_content">
  <ckeditor  id="note" name="note" [(ngModel)]="textContent" ></ckeditor>
  <br/>
<span>
  {{ textContent }}
</span>
</div>

Наконец, мой plugin.js:

CKEDITOR.plugins.add( 'note', {
    icons: 'note',
    init: function( editor ) {
        console.log('Loading Note Plugin')
        editor.addCommand( 'triggerNote', {
            exec: function( editor ) {
                console.log('triggerNote Clicked: ' + editor.container);
                var divNode = editor.container.$.parentNode.parentNode.parentNode;
                var event = new CustomEvent('noteevent');
                divNode.dispatchEvent(event);
            }
        });

        editor.ui.addButton( 'Note', {
            label: 'Trigger Note',
            command: 'triggerNote',
            toolbar: 'insert'
        });
    }
});

В методе exec я сначала пытаюсь получить узел div, который является включающим элементом компонента Angular. и я отправляю пользовательское событие на него. Я надеюсь, что это будет подхвачено угловым компонентом, но это не так.

Мне любопытно, в чем проблема с моим решением. Я также открыт для других идей, чтобы заставить плагин CKEditor 4 поговорить с Angular.