Angular 2 (ändern) für den Dateiupload

9

Ich verwende das Angular 2 (change), um die hochgeladene Datei zu erkennen und die Funktion auszulösen. Aber ich stehe vor dem Problem, wenn ich die gleiche Datei erneut hochladen wollte, da es keine Änderung in der Datei gibt, (Änderung) wird nicht ausgelöst. Bitte schlagen Sie in diesem Fall die Ereignisbindung vor.

%Vor%

Gibt es eine Möglichkeit, den Eingabewert des Typs file auf leer zu setzen.

    
Developer 26.08.2016, 19:12
quelle

1 Antwort

14

Sie können auf die Dateieingabe als ViewChild zugreifen und die Dateien daraus abrufen.

%Vor%

.files[] auf dem nativenElement ist immer ein Array, auch wenn nur eine Datei ausgewählt ist (oder keine). Es gibt Ihnen Dateiobjekte genau so, wie Sie es tun würden, wenn Sie vom event.target.files -Ereignis auf (change) zugegriffen hätten, so dass Sie mit ihnen machen können, was Sie nach der Tat wollen.

Es sollte jedoch erwähnt werden, dass, wenn eine Datei in der Dateieingabe ausgewählt wird und das Änderungsereignis ausgelöst wird, die Datei nicht irgendwo "hochgeladen" wurde. Es übergibt dem Browser nur einen Verweis (mit einigen anderen Metadaten), mit dem der Client arbeiten kann. Das Hochladen der Dateien ist etwas, das Sie separat programmieren müssen.

UPDATE:

Um zu erzwingen, dass die Dateieingabe das Änderungsereignis auslöst, selbst wenn eine Datei ausgewählt wurde, die zuvor ausgewählt wurde, muss die Dateieingabe zurückgesetzt werden, indem der Wert gelöscht wird, wenn auf die Schaltfläche Durchsuchen geklickt wird. Da Sie jQuery bereits verwenden, können Sie das folgendermaßen tun: $('#fileupload').val(""); .

Siehe meinen gespaltenen Plunker für ein funktionierendes Beispiel.

    
ABabin 26.08.2016, 20:22
quelle