首页 > 解决方案 > 验证图像尺寸 - Angular 6

问题描述

我正在尝试验证上传图像的宽度或高度不能超过 1024 像素。这就是我所做的,但由于某种原因它每次都不起作用:

readThumbUrl(event: any) {
        this.thumbnailFile = [];
        const eventObj: MSInputMethodContext = <MSInputMethodContext> event;
        const target: HTMLInputElement = <HTMLInputElement> eventObj.target;
        const files: FileList = target.files;
        if (files) {
            this.thumbnailFile.push(files[0]);
        }

        var image;

        if (event.target.files && event.target.files[0]) {
            let reader = new FileReader();

            reader.onload = (event: ProgressEvent) => {
                this.thumbUrl = (<FileReader>event.target).result;
// This part is for validation
                image = new Image();
                image.src = (<FileReader>event.target).result;
// Here, sometimes it takes width 0 and sometimes it takes image width,
// dont know for what reason.
                if (image.width > 1024 || image.height > 1024) {
                    this.dimensionError = true;
                }
            };

            reader.readAsDataURL(event.target.files[0]);
        }

        this.videoModel.thumbnail = event.target.value;
    }

所以验证有时会触发,有时不会,有更好的方法吗?

标签: javascriptangular

解决方案


推荐阅读