Ckeditor5 w/Angular SSR

Workaround to allow the ckeditor5 to work with an Angular SSR application.

Filename: editor.component.ts

export class EditorComponent {
  @Input() story: any;
  @Input() config: any;
  @Input() ready: any;
  @Output() readyChange = new EventEmitter<any>();
  @Output() editorChange = new EventEmitter<ChangeEvent>();
  isBrowser: boolean = false;
  Editor: any;

  constructor(@Inject(PLATFORM_ID) platformID: Object) {
    this.isBrowser = isPlatformBrowser(platformID);
    if (this.isBrowser) {
      const CustomEditor = require("../shared/CustomEditorSuperBuild/ckeditor");
      this.Editor = CustomEditor.CustomBalloonEditor;
    }
  }

  onReady(ready_event: any) {this.readyChange.emit(ready_event)}
  onChange(change_event: ChangeEvent) { this.editorChange.emit(change_event); }
}

Filename: editor.component.html

<ckeditor
  *ngIf="isBrowser"
  [editor]="Editor"
  [(ngModel)]="story"
  (ready)="onReady($event)"
  (change)="onChange($event)"
  tagName="story"></ckeditor>

References:

• https://github.com/ckeditor/ckeditor5-angular/issues/99#issuecomment-578936859