我正在尝试更新模块而不上传新图像。问题是,如果我没有上传新图像,而是尝试使用我从api读回的图像,那么在调试时它会显示read.result is undefined
。我认为读者期待一个图像流,我给它一个网址。不知道如何解决这个问题。
API采用DataURL
作为图像,然后将其存储并将图片路径/网址放在ImageURLPATH
中。
代码:
angular.module('Services.modulesPUT', [])
.service('modulesPUTSrvc', function (baseSrvc, $http,modulesGETSrvc,$rootScope,$state, myConfig) {
var fObject = {};
fObject.myForm = {};
fObject.details = {};
fObject.imgObject = {};
fObject.put = function ()
{
var imageData;
if (fObject.myForm.$valid)
{
var reader = new window.FileReader();
reader.readAsDataURL(fObject.details.ImageURLPath);
reader.onloadend = function () {
$rootScope.loading = true;
var result = $http({
method: "PUT",
dataType: 'json',
data: {
"DataURI": reader.result
},
url: myConfig.baseURL + 'odata/Modules(' + fObject.details.ModuleId + ')'
});
result.success(function (data) {
$rootScope.loading = false;
baseSrvc.toastMessage('Module has successfully been updated.');
$state.go('base.modules.get');
});
result.error(function (data) {
$rootScope.loading = false;
baseSrvc.returnError(data);
});
};
}
else
{
baseSrvc.toastMessage('Please input all required fields.');
};
};
return fObject;
});
<div class="md-block" flex-gt-sm>
<div class="imageUpload">
<md-tooltip md-direction="left">
Click here to select your image
</md-tooltip>
<div class="button"
required
ngf-select
ng-model="srvcObject.details.DataURI"
name="file"
ngf-pattern="'image/*'"
ngf-accept="'image/*'"
ngf-max-size="20MB"
><span ng-show="!srvcObject.details.DataURI">Select <br/> Course Image</span></div>
<div class="preview"
ngf-src="srvcObject.details.ImageURLPath"
ngf-background="srvcObject.details.ImageURLPath"></div>
</div>
</div>