KillerCodeMonkey / ngx-quill

Angular (>=2) components for the Quill Rich Text Editor
MIT License
1.79k stars 262 forks source link

Delta in reactive forms and a debounceTime #1514

Closed Marius-Romanus closed 2 years ago

Marius-Romanus commented 2 years ago

Hello!

The delta that is returned with the reactive forms and a debounceTime is not correct, it seems that it only returns the last letter instead of the whole set.

You can see it in your git examples: https://github.com/killerCodeMonkey/ngx-quill-example In: src\app\reactive-forms\reactive-forms.component.ts line 52.

Example:

this.editor
  .onContentChanged
  .pipe(
    debounceTime(400),
    distinctUntilChanged()
  )
  .subscribe((data: ContentChange) => {
    // tslint:disable-next-line:no-console
    console.log('Delta', data.delta)
    // tslint:disable-next-line:no-console
    // console.log('view child + directly subscription', data)
  })

Thank you! a greeting.

KillerCodeMonkey commented 2 years ago

now i get your question. yes because it is hard to get the whole delta, because i do not know how to safely merge all changes made in the meantime

Marius-Romanus commented 2 years ago

oops, sorry, I did not remember that I had already posted a similar topic. 😅

I've been looking at the code and I'm sorry I can't help, but I think it would be something similar to what this library does, controlling the states? https://github.com/quilljs/delta#compose

Regards!

KillerCodeMonkey commented 2 years ago

yep but i do not know exactly how i know how many changes are happening for a subscription. But you can implement it for your single subscription.

just add a counter to your component and init it with 0. add a "tap" operator of rxjs before your debounce and increase the count. is you subscribe is called you can then retrieve the right count of changes and reset the counter

Marius-Romanus commented 2 years ago

Thanks! with tap it can be done perfectly!

KillerCodeMonkey commented 2 years ago

But in the example I explicitly use the ngx-quill event onEditorChanged and not the formControl

Marius-Romanus @.***> schrieb am Do., 31. März 2022, 13:46:

Hello!

The delta that is returned with the reactive forms and a debounceTime is not correct, it seems that it only returns the last letter instead of the whole set.

You can see it in your git examples: https://github.com/killerCodeMonkey/ngx-quill-example In: src\app\reactive-forms\reactive-forms.component.ts line 52.

Example:

this.editor .onContentChanged .pipe( debounceTime(400), distinctUntilChanged() ) .subscribe((data: ContentChange) => { // tslint:disable-next-line:no-console console.log('Delta', data.delta) // tslint:disable-next-line:no-console // console.log('view child + directly subscription', data) })

Thank you! a greeting.

— Reply to this email directly, view it on GitHub https://github.com/KillerCodeMonkey/ngx-quill/issues/1514, or unsubscribe https://github.com/notifications/unsubscribe-auth/AARI4YDM7RCLFSZTKSV4DA3VCWGCVANCNFSM5SFDLOBQ . You are receiving this because you are subscribed to this thread.Message ID: @.***>