来自Angular 4中的api调用的TinyMce中的SetContent

Question

我正在尝试在我的角度4项目中实施tinymce。 我想从网络API获取内容并在tinymce编辑器中显示

这是我的组件

import {Component,OnInit,OnDestroy,AfterViewInit,EventEmitter,Input,Output,
  Inject,ElementRef } from '@angular/core';
  
declare var tinymce: any;

@Component({
  selector: 'first-angular-project-tiny-mce',
  template: `<textarea id="{{elementId}}"></textarea>`,
  styleUrls: ['./tiny-mce.component.css'],
})

export class TinyMceComponent implements AfterViewInit, OnDestroy {
  @Input() elementId: any;
  @Output() onEditorKeyup = new EventEmitter<any>();
  editor;

ngAfterViewInit() {
    tinymce.init({
      selector: '#' + this.elementId,
      plugins: ['link', 'paste', 'table'],
      skin_url: 'assets/skins/lightgray',
      automatic_uploads: true,
      setup: editor => {
        this.editor = editor;
        
        //i am trying to set content here
        this.editor.setContent('<span>test</span>');

        editor.on('keyup', () => {
          const content = editor.getContent();
          this.onEditorKeyup.emit(content);
        });
    );
       },
    });
  }
  
  ngOnDestroy() {
    tinymce.remove(this.editor);
  }

}

这是我的组件标记

   <first-angular-project-tiny-mce [elementId]="Editor"  (onEditorKeyup)="keyupHandler($event)"></first-angular-project-tiny-mce>

当我设置内容时，我收到以下错误

任何人都可以告诉我在tinymce中设置内容的正确方法是什么？