Angular引入Ckeditor5的方法

第一步：使用npm安装Ckeditor5，Ckeditor有三个版本可供选择，开发者可以根据实际应用场景选择对应版本安装，这里我们以经典版为例，使用如下代码安装经典版：

npm install --save @ckeditor/ckeditor5-build-classic

第二步：在对应组件中，引入Ckeditor5，将以下代码写在组件*.ts文件顶部

import ClassicEditor from '@ckeditor/ckeditor5-build-classic';

第三步：在对应组件html模板中，加入编辑器代码

<textarea name="content" id="editor"> <p>Here goes the initial content of the editor.</p> </textarea>

第四步：初始化Ckeditor，在组件ts文件中定义editor变量，然后再ngOnLnit中进行初始化，注意下方粗体代码：

 private editor;
  constructor() {
  }

  ngOnInit() {
      ClassicEditor
          .create( document.querySelector( '#editor' ) )
          .then( editor => {
              this.editor = editor;
          } )
          .catch( error => {
              console.error( error );
          } );
  }

---

到此为止，完成Ckeditor5的安装及简单使用示例。