Проверьте размеры файла изображения при вводе на стороне клиента AngularJS

0

Я хотел проверить размеры изображения перед загрузкой на сервер на стороне клиента. Я попытался найти решение для него, но я мог найти решения с img.Onload(), которые я не ищу.

Я просто хочу, чтобы пользователь выбирал изображение из
<input id="selectThumb" name="myImage" type="file" accept="image/*" onchange="angular.element(this).scope().fileName(this)" </input>
и после выбора файла должно отображаться только имя и некоторое предупреждение, если изображение больше 172X152px. Я не просматриваю изображение или что-то еще. Функция fileName (this) "дает мне имя файла изображения, я не могу получить размеры изображения и, следовательно, не могу их проверить. PS, я определил эту функцию в моей директиве.

Еще раз хочу показать предупреждение, когда пользователь выбирает файл, если его файл не может быть загружен, т.е. больше 172X152px. Я не загружаю файл изображения на свою страницу или не просматриваю его.

Теги:

1 ответ

3

Я боюсь, что вам нужно использовать Image.onLoad. Но не беспокойтесь, изображение не нужно показывать нигде.

Пример: Получение изображений с помощью API файлов Javascript

    var fr = new FileReader;

    fr.onload = function() { // file is loaded
        var img = new Image;

        img.onload = function() {
            //TODO: Add your validation here
            alert(img.width); // image is loaded; sizes are available
        };

        img.src = fr.result; // is the data URL because called with readAsDataURL
    };

    fr.readAsDataURL(this.files[0]); // I'm using a <input type="file"> for demonstrating

Ещё вопросы

Сообщество Overcoder
Наверх
Меню