0
我想顯示文件上傳(文件讀取器)的進度。如何通過angularjs將指令中的數據傳遞給控制器?
這裏是我的html:
<md-progress-linear id="file-progress-indicator" md-mode="determinate" value="{{progress}}"></md-progress-linear>
,這裏是我的指令:
angular.module('image.directives').directive('edFileUploader', ['$parse', '$mdDialog', '$mdBottomSheet', '$timeout', 'toastr', function($parse, $mdDialog, $mdBottomSheet, $timeout, toastr) {
return {
restrict: 'A',
link: function($scope, el, attrs) {
var setter = $parse(attrs.edFileUploader)($scope);
$(el[0]).on('change', function(e) {
var reader = new FileReader();
if (setter) {
setter(event.target.result, el);
if (typeof attrs.edCloseAfter !== 'undefined') {
$mdBottomSheet.hide();
}
}
};
reader.onprogress = function(data) {
if (data.lengthComputable) {
var progress = parseInt(((data.loaded/data.total) * 100), 10);
// $scope.progress = progress;
}
}
if (e.target.files[0] != undefined) {
reader.readAsDataURL(e.target.files[0]);
$scope.loading = false;
el.next().removeClass('loading');
$scope.done = true;
} else {
$scope.loading = false;
el.next().removeClass('loading');
$scope.done = true;
}
});
}
}
}]);
如何從reader.onprogress傳遞變量的進步,使其進度條會按預期工作?
這裏是很好的例子http://jsfiddle.net/maxisam/QrCXh/ –