«ckeditor» не является известным элементом Ionic 4

Question

Я работаю над проектом Ionic. Я пытаюсь интегрировать модуль CKEditor в мой проект.

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

Я получаю сообщение об ошибке:

'ckeditor' не известенelement.

Итак, я попробовал некоторые решения, которые я нашел в Интернете, но, к сожалению, у меня ничего не получилось.

Я попытался включить CUSTOM_ELEMENTS_SCHEMA и NO_ERRORS_SCHEMA. Я включил FormsModule, но без шансов.

Мне было интересно, не могли бы вы помочь мне, пожалуйста?

Заранее спасибо.

Answer 1

установите оба этих пакета в приложение 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, тогда необходимо импортировать CKEditorModule в summary.module.

допустим, у вас есть summary.module.ts, например:

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

, затем импортируйте CKEditor в summary.component.ts

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() {
  }
}

Answer 2

так что я решил проблему. Я сделал следующее:

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 );
} );