Question

这是我的HTML代码。如何限制用户输入最多5000个字符。

<div class="ql-container ql-bubble" id="richTextQuel">
  <ng-quill-editor theme="bubble" id="richTextEditor" placeholder="Inclusions" ng-model="title" modules="richTextEditorModules" class="ng-pristine ng-untouched ng-valid ng-isolate-scope 
                             ng-not-empty">
  </ng-quill-editor>
</div>

Answer 1

参考文档text-change

标记代码： -

<div class="ql-container ql-bubble" id="richTextQuel">
   <ng-quill-editor theme="bubble" id="richTextEditor" placeholder="Inclusions" ng-model="title" modules="richTextEditorModules" class="ng-pristine ng-untouched ng-valid ng-isolate-scope ng-change="textChanged($event)"
   ng-not-empty">
   </ng-quill-editor>
</div>

Js代码： -

var limit = 5000;
quill.on('text-change', function(delta, old, source) {
    if (quill.getLength() > limit) {
        quill.deleteText(limit, quill.getLength());
    }
});

Answer 2

这是Angular 2+和PrimeNG的解决方案，但是您可以更改它以适合您的解决方案：

this.editor.getQuill().root.addEventListener('keydown', ($event) => this.checkLength($event));

其中checkLength是：

checkLength($event) {
    if (this.editor.getQuill().root.innerHTML.length >= 15) {
        $event.preventDefault();
    }
}

如何将quill编辑器的文本字符限制限制为angularJS中的最大5000个字符？

2 个答案: