Wie man die Option "params" in dropzone.js hinzufügt Angular4

Question

Ich mache eine Anwendung in eckigen 4. Ich benutze dropzone.js, um Dateien nach hinten zu übertragen. Um Dropzone.js in eckigen 4 zu verwenden, benutze ich ngx-dropzone-wrapper.

Ich möchte eine neue Parameter übergeben, wenn eine Datei gesendet wird (mit den Optionen "Parameter"). Die Parameter sind eine Funktion, die eine Zeichenfolge zurückgibt, und das Ergebnis ändert sich bei einem Benutzerklick. Es ist tatsächlich ein Singleton und das erste Mal, dass es erstellt wird, ist in der Funktion ngOnInit() in der app.component.ts-Datei.

Aussehen Meine app.module.ts wie folgt aus (in dem die dropzone.js Modul zum Projekt hinzugefügt wird):

import { DropzoneModule, DropzoneConfigInterface } from 'ngx-dropzone-wrapper'; 
const DROPZONE_CONFIG: DropzoneConfigInterface = { 
    url: 'http://localhost:81/api/createFiles', 
    maxFilesize: 50, 
    acceptedFiles: 'image/*', 
    params: { 'whereToCreate': **the function goes here** } 
}; 

@NgModule({ 
... 
imports: [ 
    ... 
    DropzoneModule.forRoot(DROPZONE_CONFIG) 

Mein HTML die NGX-Dropzone-Wrapper (es ist genau wie das Beispiel in die github of ngx-dropzone-wrapper):

<dropzone [config]="config" [message]="'Click or drag images here to upload'" (error)="onUploadError($event)" (success)="onUploadSuccess($event)"></dropzone> 

Answer 1

ich wusste nicht, aber Dropzone.js die Eingänge alle in Form senden.

Also, ich die div in eine Form umwandeln und einen versteckten Eingang hinzufügen:

<form [dropzone]="config" (error)="onUploadError($event)" (success)="onUploadSuccess($event)"> 
    <input type="hidden" name="whereToCreate" value="{{ this.currentFolder.get() }}"> 
</form> 

Answer 2

Try this: Wenn die Datei wird gesendet auslösen und viele Ereignis unter ihnen Veranstaltung in diesem Fall das Senden Sie erhalten als Parameter Datei, xhr, formData in der FormData können Sie .append (Schlüssel, Wert). Dann wird es mit jeder Datei die neuen Parameter senden. Ihre html:

 <div class="text-center well"> 
      <dropzone [config]="dropzoneConfigI" 
       [message]="'Click or drag images here to upload'" 
       (error)="onError($event)" 
       (sending)="onSending($event)" 
       (sendingmultiple)="onSendingmultiple($event)" 
       (success)="onSuccess($event)" 
       (addedfile)="onAddedFile($event)" 
      > 
      </dropzone> 
    </div> 

Ihr Controller:

onSending(data): void { 
    // data [ File , xhr, formData] 
    const file = data[0]; 
    const formData = data[2]; 
    formData.append('order', someIteratorValue); 
    } 

Hoffe, es hilft.