'ckeditor' 不是已知元素 Ionic 4答案

【问题标题】：'ckeditor' is not a known element Ionic 4'ckeditor' 不是已知元素 Ionic 4
【发布时间】：2019-11-05 12:15:47
【问题描述】：

我正在做一个 Ionic 项目。我正在尝试将CKEditor module 集成到我的项目中。

<ckeditor [(ngModel)]="content" editor="Editor">
</ckeditor>

我得到一个错误：

'ckeditor' 不是已知元素。

所以，我尝试了一些我在互联网上找到的解决方案，但不幸的是，对我没有任何帮助。

我尝试包含CUSTOM_ELEMENTS_SCHEMA 和NO_ERRORS_SCHEMA。我包含了 FormsModule，但没有机会。

我想知道，如果你能帮助我，好吗？

提前谢谢你。

【问题讨论】：

请分享您的代码。

标签： ionic-framework ckeditor

【解决方案1】：

所以我解决了这个问题。我做了以下事情：

var textarea = document.getElementById('editor1');
const ClassicEditor = require( '@ckeditor/ckeditor5-build-classic' );
ClassicEditor.create( document.getElementById( 'editor1' ) )
.then( editor => {
    console.log( editor );
} )
.catch( error => {
    console.error( error );
} );

【讨论】：

【解决方案2】：

在您的 angular 或 angular-ionic 应用程序中安装这两个软件包。

npm install --save @ckeditor/ckeditor5-angular

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

然后导入模块app.module.ts，并在组件中使用。

import * as CKEditor from '@ckeditor/ckeditor5-build-classic';

@Component({
  selector: 'app-editor',
  template: '<ckeditor [editor]="editor" [data]="summary"></ckeditor>',
  styleUrls: ['./edit-summary.component.scss']
})
export class EditorComponent {

  summary: string = `<p>Lorem ipsum</p>`
  public editor = CKEditor
  constructor() {
  }
}

如果没有找到 ckeditor，请阅读以下内容：

即你有组件summary.component，它在summary.module 中声明，那么有必要在summary.module 中导入CKEditorModule。

假设你有 summary.module.ts 喜欢：

import { CKEditorModule } from '@ckeditor/ckeditor5-angular';
@NgModule({
  declarations: [
    SummaryComponent
  ],
  imports: [
    CommonModule,
    CKEditorModule,
  ],
  exports: [
    SummaryComponent
  ],
})
export class SummaryModule { }

然后在summary.component.ts中导入CKEditor

import * as CKEditor from '@ckeditor/ckeditor5-angular';

@Component({
  selector: 'app-edit-summary',
  template: '<ckeditor [editor]="editor" [data]="summary"></ckeditor>',
  styleUrls: ['./edit-summary.component.scss']
})
export class EditSummaryComponent {

  summary: string = `<p>Lorem ipsum</p>`
  public editor = CKEditor
  constructor() {
  }
}

【讨论】：