JS读取本地上传资源文件

<div style="width: 162px;" id="result1">
<label for="cert_1" class="label-upload label-upload-preview" data-ng-click="getUploadToken(true)">
</label> <input id="cert_1" type="file" accept="image/*" onchange="angular.element(this).scope().uploadCert1(this)" />
<progress id="cert1_upload_progress" max="100" value="0"></progress></div> 
<input type="text" data-ng-model="certs[0].cert_type_name" placeholder="证书名称 ＊">

JS部分：

$scope.readFile = function(cert, id) {
		if ("result1" === id) {
			result = document.getElementById("result1");
		} else if ("result2" === id) {
			result = document.getElementById("result2");
		} else if ("result3" === id) {
			result = document.getElementById("result3");
		}
		var input_id = cert.id;
		if (typeof FileReader === 'undefined') {
			result.innerHTML = "抱歉，你的浏览器不支持 FileReader";
			input_id.setAttribute('disabled', 'disabled');
		}
		var file = cert.files[0];
		if (!/image\/\w+/.test(file.type)) {
			alert("文件必须为图片！");
			return false;
		}
		var reader = new FileReader();
		reader.readAsDataURL(file);
		reader.onload = function(e) {
			result.innerHTML = '<img src="' + this.result
					+ '" alt="" width="100%" height="100%"/>'
		};
	};

$scope.uploadCert1 = function(cert) {
		var el = angular.element($('#cert_1'))[0];
		var progress = angular.element($('#cert1_upload_progress'));
		qiniuService.upload(el, $scope.token, function(url, json) {
			$scope.certs[0].url = json.key;
			$scope.readFile(cert, "result1");
		}, progress);
	};

参考博客：

http://www.cnblogs.com/tugenhua0707/p/4605593.html

转载于:https://my.oschina.net/zhouyang2021/blog/552760