Не удается найти имя «CKEDITOR».Вы имели в виду член экземпляра this.CKEDITOR?

Question

Я разрабатываю PWA с Ionic 3. Я использовал CKEDITOR, чтобы получить богатый вклад от пользователей.Я импортирую библиотеку CKEDITOR в index.html с кодом:

  <script src="https://cdn.ckeditor.com/4.6.1/full/ckeditor.js"></script>

Я также импортирую CKEditorModule в app.module.ts, как указано в документации.

Тогда я должен иметь возможность использовать класс CKEDITOR в своем приложении.Проблема в том, что при первой загрузке выдает ошибку:

Не удается найти имя 'CKEDITOR'.Вы имели в виду элемент экземпляра 'this.CKEDITOR'?

Затем, если я сохраняю свой редактор и он перезагружается в реальном времени, то CKEDITOR работает правильно.

Я пытался работать с жизньюциклические события, такие как ngAfterViewInit () , чтобы использовать переменную CKEDITOR только после полной загрузки, напрасно.

Я также использовал ionViewDidEnter жизненный цикл, например:

ionViewDidEnter() {
    CKEDITOR.on('instanceReady', function (this) {
      console.log(this);
      //Disable automatic inline for divs with contenteditable true.
      this.disableAutoInline = true;

      this.instances["titre"].on('focus', function (this) { this.execCommand('selectAll', false, null); });
      this.instances["adress"].on('focus', function (this) { this.execCommand('selectAll', false, null); });
      this.instances["budget"].on('focus',function (this) { this.execCommand('selectAll', false, null); });
      this.instances["name"].on('focus',   function (this) { this.execCommand('selectAll', false, null); });
      this.instances["description"].on('focus', function (this) { this.execCommand('selectAll', false, null); });

    });

CKEDITOR все еще не распознается при первой загрузке?Любой совет о том, как я мог найти проблему здесь?

Вот Stackblitz для большего понимания: (Вам нужно перейти на консоль, чтобы увидеть ошибку, на stackblitz страница будет в конечном итогеперезагрузите, чтобы редактор работал, но в моем случае он просто застрял на ошибке.

Редактирование Stablitz: Редактирование Stackblitz

Answer 1

Я нашел решение:

Вам нужно добавить

declare var CKEDITOR: any;

перед @component в файле .ts, и оно будет работать.

Answer 2

Я просмотрел ваш код, который вы использовали ng2-ckeditor .В качестве этого пакета вы не выполнили первый шаг

Установка Включите файлы javascript CKEditor в ваше приложение:

<script> src="https://cdn.ckeditor.com/4.5.11/full/ckeditor.js"></script>

Вам необходимо добавить cdn в ваш index.html и вы правильно импортировали CKEditorModule в вас app.module.ts.

Теперь вы должны использовать его в своем компоненте как

 <ckeditor
    [(ngModel)]="ckeditorContent">
  </ckeditor>

• Он загрузит ckeditor и свяжет дату с его ngModel, для дополнительной конфигурации выможете проверить ng2-ckeditor документы.

Happy Coding !!