ngx-image-cropper Выходной файл свойств с неопределенным именем

Я использую ngx-image-cropper для обрезки изображения в моем угловом приложении. . Я использую свойство Output, возвращающее «File», которое является (imageCroppedFile), чтобы иметь возможность захватить обрезанное изображение. Мне нужно, чтобы обрезанное изображение имело имя файла, чтобы я мог перебирать файлы на серверной части, используя атрибут имени, хотя по умолчанию он не определен. Как я могу дать ему имя? Я пробовал следующее: в FormData,

var formData:any = new FormData();
console.log('The number of files is '+files.length);//Logs the number of files is 1

for(var i=0; i<files.length;i++) {
  formData.append("uploads[]", files[i].name, 'image'+i);
  console.log('File name '+ i + ' ' +files[i].name);//Logs File name 0 undefined
}

и на метод, вызванный кадрированием

imageCroppedFile(image: File) {
  this.filesToUpload = [];
  console.log('imageCroppedFile method '+image.name+ ' size is '+image.size);// Logs imageCroppedFile method undefined size is 380284
  this.filesToUpload[0]=image;
  console.log('The filesToUpload is '+this.filesToUpload[0].name);// Logs The filesToUpload is undefined
}

Загрузчик работает без обрезки.


typescript image angular cropper
person Dejazmach    schedule 03.10.2018    source источник
comment
Какие свойства вы видите при отображении образа журнала консоли?   -  person Ritesh    schedule 03.10.2018
comment
@Ritesh File (390053) {name: blob, lastModified: 1538659450015, lastModifiedDate: четверг, 04 октября 2018 г., 16:24:10 GMT+0300 (время Восточной Африки), webkitRelativePath: , size: 390053, …}   -  person Dejazmach    schedule 04.10.2018
comment
Я столкнулся с той же проблемой   -  person Kishita Variya    schedule 07.06.2020

Ответы (2)


arrow_upward
1
arrow_downward

вставьте свой файл в большой двоичный объект, и вы можете назвать свой большой двоичный объект самостоятельно

const blobImage = file as Blob;

Ссылка: https://github.com/Mawi137/ngx-image-cropper/issues/91#issuecomment-422252629

person Pandiyan Cool    schedule 03.10.2018
comment
Затем blobImage имеет только тип и размер в качестве свойств. Можете ли вы уточнить, пожалуйста? - person Dejazmach; 03.10.2018

arrow_upward
0
arrow_downward

Это работает для меня:

// grab the cropped area to file for upload
var b64File = this.dataURLtoFile(this.croppedImage, 'hello.jpg');  // you can name it anything.

dataURLtoFile(dataurl, filename): File {
        var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
            bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
        while(n--){
            u8arr[n] = bstr.charCodeAt(n);
        }
        return new File([u8arr], filename, {type:mime});
    }
person Jeb50    schedule 09.04.2021