Alertify confirm does not work with Ember js

Question

I'm attempting to make a popup box which confirms if you want to delete a document. If I try:

if(alertify.confirm("Delete this?')) {
    this.store.findRecord('document', docId, {backgroundReload: false}).then((doc) => {
    doc.destroyRecord();
    alertify.success('Document successfully deleted!');
}

it does not wait for confirmation before running the delete code, because alertify.confirm is non-blocking, as I understand. If I try:

deleteFile(docId) {
  alertify.confirm("Are you sure you want to delete this document?", function (e) {
    if (e) {
      this.store.findRecord('document', docId, {backgroundReload: false}).then((doc) => {
        doc.destroyRecord();
        alertify.success('Document successfully deleted!');
      });
    } else {
      alertify.error('Something went wrong!');
    }
  });
}

it does ask for confirmation, but the delete code doesn't work, as the store is coming up as undefined, so findRecord doesn't work. I've tried injecting the store as a service, but that does not work either. Is there a way to get this confirmation box working?

Answer 1

You use this in a function, thus referring to the this-context of that function. You could either use fat arrow functions or assign the outer this to a variable. The former would look like this:

deleteFile(docId) {
  alertify.confirm("Are you sure you want to delete this document?", (e) => {
    if (e) {
      this.store.findRecord('document', docId, {backgroundReload: false}).then((doc) => {
        doc.destroyRecord();
        alertify.success('Document successfully deleted!');
      });
    } else {
      alertify.error('Something went wrong!');
    }
  });
}