Quill 编辑器未触发 Angular 中的（模糊）事件答案

【问题标题】：Quill editor not firing for (blur) event in AngularQuill 编辑器未触发 Angular 中的（模糊）事件
【发布时间】：2018-04-28 02:03:10
【问题描述】：

我正在使用带有 ngx-quill NPM 包的 Quill 编辑器。一切都很好，只是我无法触发（模糊）事件。

现在，我正在让它在编辑器中的每个文本更改时触发。这是控制器

ngOnInit() {
  this.adminForm.controls['content'].valueChanges.subscribe(data => {
   console.log('Changed Values', data);
  });
}

这是 HTML：

<quill-editor (change)="validateChange(field)" [formControlName]="field.id" [id]="field.id"></quill-editor>

当然，当我移动到不同的输入时，(change) 事件就会停止触发，而且我找不到访问 (blur) 事件的方法。我真正需要的是当表单域失去焦点时触发的 observable。我正在使用 Angular 5 反应式（动态）表单。

感谢您的任何想法！

【问题讨论】：

@Pankaj 完美回答了这个问题here 和 here
如果有人读过这篇文章，请使用 (focusin) 和 (focusout)。
您能否提供(focusout) fn 的链接？

标签： angular quill angular5

【解决方案1】：

我将 quill-editor 用于 cmets，我想集中精力检查用户是否未登录我在登录页面上重定向他，下面你有 quill-editor 组件 (onContentChanged)="onContentChanged($event)" quill 具有的事件发射器。

<quill-editor
    theme="bubble"
    [placeholder]="quillConfig.placeholder"
    [modules]="quillConfig.moduleConfig"
    [(ngModel)]="quillData"
    (onContentChanged)="onContentChanged($event)"
    (onSelectionChanged)="onSelectionChanged($event)"
    (onEditorCreated)="getEditorInstance($event)">
</quill-editor>

现在我将onContentChanged($event) 函数附加到(onSelectionChanged) quill eventEmitter，所以检测到一些变化的quill 组件正在调用

 onContentChanged(event: any) {
    if (!this.userAccount && event.oldRange === null && event.range !== null) {
      this.router.navigate(['/login']);
    }
  }

所以你应该有相同的功能，但检查这个条件

if (range === null && oldRange !== null) {
   //(blur event) occur and do something
}

如果您有更多问题，请随时提问。

【讨论】：