PouchDB changes fires only after the second click

Question

I´m using the PouchDB database with Ionic 4. I try to build a change listener. If I create a new document my list should know that and refresh automatically.

What I tried

checkForChanges() {
  this.pdb.changes({
    since: 'now',
    live: true,
    include_docs: true,
  }).on('change', (change) => {
    console.log(change);
    if (change.doc) {
      return this.publishers;
    }
  })
}

I fire this code ob submit the form to create a new document. The problem: The console.log fires after the second click. Why that?

Maybe an important info: I´m doing that from a Modal Dialog.

My submit function

create(publisher) {
  return this.pdb.post(publisher).then(() => {
    this.checkForChanges();
  });
}

Do you have any idea?

Answer 1

db.changes should be initialized on page load not when the user clicks the submit button.