Как загрузить изображение с данными формы с помощью ionic angular.js

Question

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

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

Благодаря

Answer 1

Попробуйте использовать $ cordovaFileTransfer для этого. Конкретная реализация описана здесь: Upload image to server angularjs

Вы можете загрузить изображение из локального хранилища или изображения, сделанного с помощью плагина камеры.

Answer 2

Чтобы загрузить изображение на сервер с использованием Ionic 2 Framework, вам необходимо использовать плагин переноса. Установить плагин передачи с помощью

ionic plugin add cordova-plugin-file-transfer npm install --save @ionic-native/transfer

Затем вызовите функцию загрузки из класса Transfer.

const fileTransfer: TransferObject = this.transfer.create(); 

    let options1: FileUploadOptions = { 
    fileKey: 'file', 
    fileName: 'name.jpg', 
    headers: {} 

    } 

fileTransfer.upload(imageDataLocalURL, 'http://localhost/ionic/upload.php', options1) 
.then((data) => { 
// success 
alert("success"); 
}, (err) => { 
// error 
alert("error"+JSON.stringify(err)); 
}); 

Используйте ссылку, чтобы узнать больше https://ampersandacademy.com/tutorials/ionic-framework-version-2/upload-an-image-to-the-php-server-using-ionic-2-transfer-and-camera-plugin

Обновлено 26-Feb-2018

Для ионического 3, плагин передачи файлов были некоторые изменения.

Для установки Перед.файлов Plugin

ionic cordova plugin add cordova-plugin-file-transfer npm install --save @ionic-native/file-transfer

и классы переименовывается в FileTransfer от передачи в Ионическом версии 3.

import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-native/file-transfer';

Для полной демонстрации, посетите ссылку ниже.

https://ampersandacademy.com/tutorials/ionic-framework-3/upload-image-to-the-php-server-using-ionic-3-file-transfer-and-camera-plugin