ng-Modell funktioniert nicht mit Dateieingabe

Question

Ich versuche, den Wert der Dateieingabe zu bekommen und es irgendwo anders, außerhalb der Eingabe anzuzeigen. Ich benutze AngularJS v1.4.8 in der App.

Dieser Ansatz funktioniert gut mit type = "text", aber nicht mit type = "file".

Warum ist es so und wie kann ich dieses Problem lösen?

Vielen Dank!

Answer 1

Da meine Aufgabe ziemlich einfach war, habe ich beschlossen, einen anderen Weg zu gehen:

html:

<input type="file" file-input="files" /> 
<ul> 
    <li ng-repeat="file in files">{{file.name}}</li> 
</ul> 

js:

.directive('fileInput', ['$parse', function ($parse) { 
    return { 
     restrict: 'A', 
     link: function (scope, element, attributes) { 
      element.bind('change', function() { 
       $parse(attributes.fileInput) 
       .assign(scope,element[0].files) 
       scope.$apply() 
      }); 
     } 
    }; 
}]); 

Dies ist tatsächlich eine Lösung aus this Tutorial. Beachten Sie, dass dies auch mit mehreren Dateien funktionieren kann.

Nichtsdestotrotz gibt es mit Serghinhos Alternative nichts Schlimmes, es gibt einfach einen einfacheren Weg, denke ich.