Редактор Quill не запускается для события (размытия) в Angular

Я использую редактор Quill с пакетом ngx-quill NPM. Все работает отлично, за исключением того, что я просто не могу запустить событие (размытие).

Прямо сейчас я заставляю его срабатывать при каждом изменении текста в редакторе. Вот контроллер

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>

Но, конечно, событие (изменение) перестает срабатывать в тот момент, когда я перехожу на другой ввод, и я не могу найти способ получить доступ к событию (размытие). Что мне действительно нужно, так это наблюдаемое, которое срабатывает, когда поле формы теряет фокус. Я использую реактивную (динамическую) форму Angular 5.

Спасибо за любые идеи !!


angular quill angular5
person Matt    schedule 15.11.2017    source источник
comment
@Pankaj отлично ответил на эти вопросы здесь и здесь   -  person Matt    schedule 15.11.2017
comment
Если кто-нибудь когда-нибудь прочитал это, используйте (focusin) и (focusout).   -  person Swoox    schedule 01.05.2018
comment
Не могли бы вы дать ссылку на (focusout) fn?   -  person DauleDK    schedule 11.09.2020

Ответы (1)


arrow_upward
0
arrow_downward

Я использую quill-editor для комментариев, и я хочу сфокусироваться, чтобы проверить, не вошел ли пользователь в систему. Я перенаправляю его на страницу входа, ниже у вас есть компонент 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
}

Если у вас есть еще вопросы, не стесняйтесь спрашивать.

person Stefan Morcodeanu    schedule 31.05.2019