Редактирование и загрузка файла BLOB-файла в angularjs

Question

Я извлекаю список файлов (которые могут быть любого типа) из базы данных mysql и преобразовываю их в byte[] и возвращаю все файлы определенного пользователя в виде массива файлов при весенней загрузке.

Теперь мне нужно отобразить все файлы в интерфейсе и предоставить возможность редактировать файл, чтобы пользователь мог удалить уже существующий файл с новым файлом.

Поэтому всякий раз, когда конкретный файл редактируется, я должен загрузить файл из внешнего интерфейса, используя угловой js.

Проблема в том, что я получаю файлы в виде массива в response.data. Я сталкиваюсь с такой проблемой, как: Как отредактировать определенный файл в этом массиве и отправить список файлов на сервер для их хранения. Я попытался просмотреть массив файлов и сохранить каждый файл как объект BLOB-объекта, но я Я не уверен, какой тип содержимого у каждого файла, так как это может быть файл любого типа (.bmp,.pdf,.docx,.tif и т. д.).

Также я не уверен, правильно ли это делать для редактирования файлов, потому что это может изменить содержимое существующего файла или изменить тип файла exixsting.

Поэтому, пожалуйста, предложите мне способ получить файл из базы данных и отредактировать файл при необходимости, а затем отправить его обратно в базу данных.

Мой контроллер и сервисы ниже:-

angular.module("app").service("serviceCalls", function($q, $rootScope, $http) {
 this.landOwnerEditProfile = function(email){
        var differed = $q.defer();
        $rootScope.config.headers.Authorization = sessionStorage.Authorization;
        $http
            .get($rootScope.URL + "/landownerDetails/"+email+"/", $rootScope.config,{
                responseType: 'blob'
            })
            .then(function(response) {
                console.log("coupon service success");


                differed.resolve(response);
            })
            .catch(function(response) {
                differed.reject(response);
            });
        return differed.promise;
    };

    this.updateLandOwnerProfile = function(details, email) {
            var differed = $q.defer();
            $rootScope.config.headers.Authorization = sessionStorage.Authorization;


            var formdata = new FormData();
            // console.log($("#file"));
            formdata.append("email", email);
            formdata.append("fname", details.user.fname);
            formdata.append("lname", details.user.lname);
            formdata.append("city", details.user.city);
            formdata.append("phone1", details.user.phone1);
            formdata.append("phone2", details.user.phone2);
            formdata.append("phone3", details.user.phone3);
            formdata.append("streetAddressLine1", details.user.streetAddressLine1);
            formdata.append("streetAddressLine2", details.user.streetAddressLine2);
            formdata.append("stripeApiKey", details.user.stripeApiKey);
            formdata.append("zipcode", details.user.zipcode);
            formdata.append("businessName", details.user.businessName);
            formdata.append("landOwnerEditProfile", true);



            // var input_files = document.getElementsByClassName("files");
            // for (var i = 0; i < input_files.length; i++) {
            //     console.log(input_files[i].files);
            //     for (var file of input_files[i].files) formdata.append("file", file.name);
            // }
            // formdata.append("file", input_files);
            // for (var key of formdata.entries()) {
            //     console.log(key[0] + ", " + key[1]);
            // }
            for (var i = 0; i < details.files.length; i++) {    
                formdata.append("file", details.files[i].file);
            }

            $http
                // .post("http://localhost:8090/", formdata, {
                .post($rootScope.URL + "/user/landownerDetails/editProfile/"+email+"/", formdata, $rootScope.config,{
                    transformRequest: angular.identity,
                    headers: {
                        "Content-Type": undefined,
                        // "Authorization":$rootScope.config.headers.Authorization
                    }
                })
                .then(function(response) {
                    // console.log(response);
                    if(response.data.status!=true){
                        throw new Error(" Details Not Updated ");
                    }
                    console.log("Details updated  success");

                    differed.resolve(response);
                })
                .catch(function(response) {
                    console.log("rejected", response);
                    differed.reject(response);
                });
            return differed.promise;

    }})

angular
    .module("app")
    .controller("landOwnerEditProfile", function($state, $scope, $location, serviceCalls, $filter, $stateParams,$timeout) {
        $scope.files = [];
serviceCalls.landOwnerEditProfile(sessionStorage.emailId)
        .then((response)=>{
            console.log(response.data);
            let status = response.status;
                if(status===200){
                    let landownerDetails = response.data;
                    let landowner = landownerDetails.dayleasingusers;
                    let userdocuments =  landownerDetails.userdocuments;// userdocument is an array containing the files
                    $scope.user = {};
                    $scope.property={};
                    $scope.user.fname = landowner.fname;
                    $scope.user.lname = landowner.lname;
                    $scope.user.streetAddressLine1 = landowner.address1;
                    // $scope.user.streetAddressLine2 = landowner.address2 ||'sdasd';
                    $scope.property.propertyType = landowner.state || 'Alabama';
                    $scope.user.city = landowner.city;
                    $scope.user.zipcode = parseInt(landowner.zipCode);
                    $scope.user.phone1 = !!landowner.phone?parseInt(landowner.phone.substring(0,3)):null;
                    $scope.user.phone2 = !!landowner.phone?parseInt(landowner.phone.substring(3,6)):null;
                    $scope.user.phone3 = !!landowner.phone?parseInt(landowner.phone.substring(6)):null;
                    $scope.user.stripeApiKey = landowner.stripeApiKey;
                    $scope.user.businessName = landowner.businessName;
                    $scope.files = [];
                    for(let doc of userdocuments){
                        let blob = new Uint8Array(doc.filedata);

                        $scope.files.push({file:new Blob([blob],{ type:'contentType'})}); //I am not sure of the contentType here.
                        // $scope.files.push({file:new Blob([doc.filedata],{ type:'multipart/form-data'},doc.filename)});
                        // $scope.files.push({file:new File([doc.filedata],doc.filename)});
                    }

                }
                else{
                    throw new Error(response.statusText);
                }

        })
        .catch((error)=>{
            console.log(error);

        })

serviceCalls.updateLandOwnerProfile($scope, sessionStorage.emailId)
                    .then(function(response) {
                        console.log(response);
                    })  
                    .catch(function(error) {
                })