Bindung in AngularJS

Question

HTML-Ansicht:

<form> 
     <input type="file" file-input="files" multiple/> 
     <button ng-click="initUpload()">Upload</button> 
</form> 

ich die folgende Direktive entlehnt aus Vielzahl von Antworten (Mehrfachdateityp Eingang binden) ich auf dieser Website:

module.directive('fileInput', ['$parse', function ($parse) { 
    return { 
     restrict: 'A', 
     link:function(scope, elm, attrs){ 
     var model = $parse(attrs.fileInput); 
     var isMultiple = attrs.multiple; 
     var modelSetter = model.assign; 
     elm.bind('change', function(){ 
      var values =[]; 
      angular.forEach(elm[0].files, function(item){ 
       var value = { 
       name: item.name, 
        type: item.type, 
        _file: item 
       }; 
       values.push(value); 

      }); 

      scope.$apply(function(){ 
       if(isMultiple){ 
        modelSetter(scope, values); 
       } else{ 
        modelSetter(scope, values[0]); 
       } 
      }); 
     }); 
     } 
    } 
}]); 

Bottomline Frage ist: In der Steuerung, wie werde ich auf das Array von Dateien zugreifen? Zur Zeit versuche ich mit $scope.values[i] auf sie zuzugreifen, aber das funktioniert nicht. Wenn ich versuche, die Anzahl der hochgeladenen Dateien zu finden, dachte ich, $scope.values.length sollte idealerweise funktionieren?

Was fehlt mir hier?

Answer 1

Wenn Sie mit der gleichen Bereichsrichtlinie einverstanden sind. Sie können dies wie folgt erreichen.

app.directive('fileInput', function() { 
    return { 
    scope: false, 
    link: function(scope, element, attr) { 
     element.on('change', function(event) { 
     scope[attr.fileInput] = event.target.files; 
     }); 
    } 
    }; 
}); 

Codepen