我想用AngularJs上传一个文件(所以图像)...我读了AngularJs不支持标签输入类型=“文件”所以我读到我需要自定义指令...我想获取输入文件并使用它对于同一页面上的节目预览(缩略图)html和控制器上传服务器上的文件...在我的页面html中我写了这段代码:
<body ng-controller="myController">
<h1>Select file</h1>
<input type="file" file-model="myFile" />
<div>
<h2>File content is:</h2>
<pre>{{ content }}</pre>
</div>
</body>
我写了这个指令:
var modulo = angular.module('myApp', []);
modulo.directive('fileModel', function () {
return {
restrict: 'A',
link: function(scope, element, attrs) {
element.on('change', function (event) {
var file = event.target.files[0];
scope.$emit("fileSelected", file);
});
}
};
});
这是我的控制器:
modulo.controller('myController', function ($scope) {
$scope.$on('fileSelected', function (event, args) {
$scope.content(args.file);
console.log(args.file);
});
});
这段代码不起作用......有解决方案吗?错误在哪里?
2 回答
错误在您的指令中
检查一下,我在我的应用程序中使用了相同的指令
这是我创建的一个小服务来处理上传
试试这个,它对我有用
您应该执行以下操作来显示图像:
要从输入中检索数据,您应该使用自定义指令,如this answer中所示:
在你的HTML中: