CKEditor 5：如何在 Angular 应用程序中访问原始文本答案

【问题标题】：CKEditor 5 : How to access raw text in Angular applicationCKEditor 5：如何在 Angular 应用程序中访问原始文本
【发布时间】：2021-01-02 15:43:45
【问题描述】：

我在我的 Angular 应用程序中使用 CKEditor 5。我必须检查用户在编辑器中输入的文本是否至少有 100 个字符。问题是绑定到编辑器的模型接收到文本+编辑器创建的用于格式化的html标记。所以我想以某种方式将我的模型的第二个属性绑定到编辑器的原始文本。这可能吗？

在我的组件中，我可以像这样访问编辑器：

 @ViewChild('ckeditor', { static: true }) private _ckEditor: CKEditorComponent;

我已尝试将此作为测试，但找不到原始文本：

  onBlur() {
   console.log( this._ckEditor.editorInstance.document.getBody().getText());
  }

和 html ：

<ckeditor #ckeditor id="desc" name="desc" [editor]="editor" (blur)="onBlur()"
                [(ngModel)]="mymodel"></ckeditor>

【问题讨论】：

【解决方案1】：

CK Editor 5 现在提供 Word Count Plugin，可用于计算在编辑器中输入的单词和字符。

【讨论】：

虽然这可能会回答这个问题，但如果可能的话，您应该 edit 您的答案包括答案本身提供的文档中最重要的信息。如果链接停止工作或内容发生重大变化，这有助于防止您的答案无效。

【解决方案2】：

您可以将选择器添加到 ckeditor 元素（例如 #myckeditor）

在ts文件中：

@ViewChild('myckeditor') myckeditor: CKEditor5.Editor;

然后只得到纯文本：

this.myckeditor.elementRef.nativeElement.innerText;

【讨论】：