AngularJS 1.5 Umfang in der Richtlinie ng-include

Question

Hier ist ein Code http://jsfiddle.net/miuosh/n6yppypj/ mit Upload-Datei-Anweisung. Das Problem ist, dass ich diese

<input type="file" file-model="myFile" /> 
    <button ng-click="uploadFile()">upload me</button> 

in ng-include = "'Ansichten/uploadFileForm.html'" verwenden.

In der Anweisung füge ich "myFile" zum Geltungsbereich hinzu. Es stellt sich heraus, dass Angular mit myFile einen neuen Bereich erstellt. So fügen Sie „myFile“ auf „rootScope“ Ich brauche

modelSetter(scope.$parent.$parent.$parent[..],element[0].files[0]) 

zu verwenden, die unbequem ist, weil ich wissen muss, wie viele Eltern Umfang ich habe.

Answer 1

Ich habe ähnliches Problem bei der Dateieingabe mit Winkel konfrontiert. Sie können eine Direktive erstellen, die Dateiänderungen abhören und ihre Controller-Funktion mit Datei aufrufen kann. Hier jsFiddle dafür.

var app = angular.module('app', []); 

app.controller('yourCtrl', function() { 
    $scope.image; 
    $scope.imageChanged= function (files) { 
     $scope.image = files; 
    }; 
}); 

app.directive('customOnChange', function() { 
    return { 
    restrict: 'A', 
    link: function (scope, element, attrs) { 
     var onChangeFunc = scope.$eval(attrs.customOnChange); 
     element.bind('change', function(event){ 
     var files = event.target.files; 
     onChangeFunc(files); 
     }); 

     element.bind('click', function(){ 
     element.val(''); 
     }); 
    } 
    }; 
}) 

<input type="file" id="imgInput" custom-on-change="imageChanged"/>