reset() function.

[Stan92]

Hi, I have some troubles using the reset function while I have existing files.

Let's say I have this context (my intial view) :

const mockFile = {
      name: "dummy file",
      size: 1024,
      accepted:true
    };
const dz = this.componentRef.directiveRef.dropzone();
dz.emit('addedfile', mockFile);
dz.emit('complete', mockFile);
dz.options.maxFiles = dz.options.maxFiles - 1;

I can't see the file using the default template of the component.

I have set a button that runs the reset method but the dropzone area is not reset.

resetDz() {
    console.log("reset");
    this.componentRef.directiveRef.reset();
  } 

If I upload a file without the "mock" part, and reset the dropzone, it works. No idea?

[sconix]

I think you need to ask that from the Dropzone users / developer in its issues / forums etc. I am not expert how the Dropzone works, this wrapper does not do anything outside of the normal Dropzone operation so how Dropzone handles reset is about its usage and not about this wrapper. I would also expect the reset to clear everything, but maybe some event emit is missing or something else that would make Dropzone know about the mock file.

[Stan92]

Using the original library with jQuery it works as expected (However I ll check if I use the same version) I thank you anyway for your reply

[sconix]

But what do you call to reset the Dropzone with jQuery? The reset function is a helper function of this library that calls removeAllFiles. Maybe you need to call it reset(true) which also cancels that uploads and removes those as well. So your mock file might be a such file that Dropzone thinks its not finished uploading.

[Stan92]

Just by calling removeAllfiles() It removes all the mock files from the dropzone area as well as the files I’ve uploaded With the wrapper my mock files are displayed well inside the dropzone area but if I call the reset and/or the removeAllfiles functions they are still present in the area even It’s in my point of view a matter of UI like if the dom is not updated

[sconix]

At least there is no way that this library or Angular should be able to effect the way how Dropzone updates DOM (afaik). So most likely something has changed in Dropzone.

[Stan92]

Ok, I got it... I have to add a timer. In fact my DZ wrapper is used inside a modal. When the modal is opened at the first time, I have the issue.

This is what I did and seems to be ok

    this.smModal.show();
    if (!this.isLoaded) {
      setTimeout(x => {
        this.loadMock(item)
      }, 400);
    } else {
      this.loadMock(item)
    }

and

  loadMock(item: FileItem) {
    this.isLoaded = true;
    const dz = this.componentRef.directiveRef.dropzone();
    const mockFile = {
      name: item.fileName,
      size: item.poids,
      accepted: true
    };
    if (dz.files.length > 0) {
      dz.removeAllFiles();
    }
    dz.files.push(mockFile);
    dz.emit('addedfile', mockFile);
    dz.emit('complete', mockFile);
  }

I thank you once again for the support..