ionic 2：以表单形式将文档、pdf上传到服务器

Question

我在 ionic 2 中创建了一个表单，其中有一个用于上传 .docs 或 .pdf 类型的简历的字段。我尝试添加如下，

<form [formGroup]="myForm">

<ion-list>
            <ion-item>

                <input type="file" formControlName="upresume_one" name="upresume_one"/>
                <p>Supported formats .doc,.docs and .pdf[Max file size: 500KB]</p>
            </ion-item>
       <div class="text-right">
                <button ion-button style="background-color: #16a085;color: white;" color="secondary" (click)="save(myForm.value)">Submit</button>
            </div>

        </ion-list>


</form>

我的.ts文件如下：

myForm: FormGroup;
  private myData: any;

constructor(public navCtrl: NavController, 
      public navParams: NavParams, 
      private builder: FormBuilder, 
      private userProfileService: UserProfileService,
      private progressDialog: ProgressDialog) {

this.myForm = builder.group({
 'upresume_one': ['', Validators.required]
})

关于提交我正在调用保存功能，如下所示，

save(formData) {
console.log('Form data is ', formData);
}

在 consoel.log 中，即使在选择了有效文件后我也得到了 null。有人可以建议我在 ionic 2 中将输入类型文件集成到表单中的最佳方法是什么吗？

Answer 1

我终于找到了这个问题的答案。您必须有一个单独的 API 可用于上传文件。下面是在 ionic 2 中上传文件的详细步骤：

首先将 ionic 文件选择器插件安装到您的应用中。https://ionicframework.com/docs/native/file-chooser/
1. 将此代码保存在某个函数中，您可以通过显示上传简历或某个文件的按钮触发该函数。

this.fileChooser.open()
  .then(uri => console.log(uri))
  .catch(e => console.log(e));

然后从此处将传输插件安装到您的应用程序中：https://ionicframework.com/docs/native/transfer/这可用于将文件上传到您的服务器。
我用来从图库或相机拍照并通过API上传的完整代码在这里：https://gist.github.com/coolvasanth/ab61fc337e6561be4559171b74221b1a
上传.pdf,.docs类文件请参考： https://gist.github.com/coolvasanth/b266c5bb382ddbfc60ca1c0f7c9f33c0
要从 phone 捕获视频并通过 API 将其上传到服务器，请使用：https://gist.github.com/coolvasanth/8d0b6a4cea480bc7017bce0ba3ec5bdb
要在 iOS 中选择媒体以外的文件（例如 .pdf、.doc），您可以参考下面的内容 link。 https://gist.github.com/coolvasanth/d042a26deda75f5e390b42b87995f30d。如果您想从 iCloud 选择文件，请在 xcode 中启用此服务。您将在项目 -> 功能 -> iTune 中找到它。

ionic 2：以表单形式将文档、pdf上传到服务器

ionic 2: Uploading docs, pdf to server in forms

cordova

hybrid-mobile-app

ionic2