无法为打字稿中的输入类型框指定图像高度和宽度



我正在尝试获取图像高度和图像宽度并将其分配给隐藏在html中的输入类型文本,如下所示:

目的是获取高度和宽度以检查和验证它们。

.html:

<input type="file" class="file" #introIcon id="uploadBtn" (change)="onFileChange($event)" name="browseIcon">
<input type="number" class="hidden" id="imgWidth" value="">
<input type="number" class="hidden" id="imgHeight" value="">

TS:

onFileChange(event) {
if (event.target.files.length > 0) {
const file = event.target.files[0];
this.fileName = file.name;
this.fileType = file.type;
if(this.fileType == 'image/png' || this.fileType == 'image/jpeg' || this.fileType == 'image/PNG' || this.fileType == 'image/JPEG') {
const reader = new FileReader();
reader.onload = e => {
this.url = reader.result;
var imageObj = new Image();
imageObj.src = this.url;
imageObj.onload = function () {
console.log('p1:', imageObj.height);
console.log('p2:', imageObj.width);
// (<HTMLSelectElement>document.getElementById('imgWidth')).value = imageObj.width;  <-- here getting error
// (<HTMLSelectElement>document.getElementById('imgHeight')).value = imageObj.height; <-- here getting error
};
}
reader.readAsDataURL(file);
let fName = (<HTMLSelectElement>document.getElementById('uploadFile')).value;
fName = this.fileName;
this.uploadFileName.nativeElement.value = fName;
this.form.get('browseIcon').setValue(file);
} else {
// error
}
}
}

在以下行中出现错误:

(<HTMLSelectElement>document.getElementById('imgWidth')).value = imageObj.width;  
(<HTMLSelectElement>document.getElementById('imgHeight')).value = imageObj.height;

类型"数字"不可分配给类型"字符串">

我已经尝试过谷歌,但没有一个解决方案奏效!

试过这个:类型"数字"不能分配给类型"字符串">

怎么样

(<HTMLSelectElement>document.getElementById('imgWidth')).value = imageObj.width.toString();  
(<HTMLSelectElement>document.getElementById('imgHeight')).value = imageObj.height.toString();

最新更新