Почему отправка файла так сложно с использованием угловых? [закрыто]

Я должен отправить файл (очень большой файл) на сервер. Я изучаю, какие у меня есть варианты и как это сделать. Я использую angular + express + nodejs.

Если бы я использовал простую форму, я мог бы без проблем перехватить файл на сервере, используя multer. Это очень просто. HTML-это просто форма, в которой я указываю цель и т. Д., И все работает. Код nodejs также очень прост и понятен.

Как только я пытаюсь использовать angular, все становится невероятно сложным. Это означает, что я должен использовать директиву, и все еще иметь проблемы с сервером. Как я уже сказал, я использую multer, который требует, чтобы данные были «multipart / form-data», и я получаю с сервера «Ошибка: Multipart: Граница не найдена»

Есть много модулей для загрузки файлов в угловых. Что показывает, что это повторяющаяся проблема с более чем одним решением. Теперь я не хочу размещать код, потому что для этого я попросил переполнение стека . Мой вопрос более тонкий:

Почему то, что можно сделать с простой формой, так сложно в угловом? Я не имею в виду это плохо. Я имею в виду это «я хочу понять».

Angular для одностраничных приложений, формы отправляются с использованием AJAX, чтобы избежать перезагрузки страницы. Для отправки составных форм с помощью AJAX ваш браузер должен поддерживать FormData(IE10 +): http://caniuse.com/#search=FormData

https://developer.mozilla.org/en-US/docs/Web/API/FormData

ngModelне работает с вводом [type = "file"], поэтому вы должны создать свою собственную директиву. Ваша собственная директива должна быть простой: при изменении обновите Fileобъект в своей области видимости.

При отправке формы создайте FormDataобъект и добавьте в него свои файлы, используя FormData.setили FormData.append. Вы можете отправить свои FormData с помощью $httpили $resource, и вы полагаетесь на браузер для установки типа контента и границы.

var formData = new FormData();
formData.append('file', $scope.file);
$http.post('yourUrl', formData, {
   transformRequest: angular.identity,
   headers: {'Content-Type': undefined}
}).then(function () {
   // ...
});

angular.identity не позволяет Angular делать что-либо с нашими данными (например, сериализацию).

Я рекомендую эту статью: https://uncorkedstudios.com/blog/multipartformdata-file-upload-with-angularjs