如何从角度上传视频文件并将其发送到服务器

时间:2019-06-28 09:27:53

标签: html angular typescript

我正在尝试将视频从angular上载到php服务器,我已经在Google上进行了一些搜索,但仍然没有解决我的问题的方法。

我已经完成了上传图片的步骤,我想对视频做同样的事情

这是上传图像文件的代码:

--- HTML

<div class="col-7">

  <input (change)="fileChangeEvent($event)" type="file" accept="video/mp4,image/png,image/jpeg"  />
                              <br><br>
                              <div>
                                <image-cropper
                                    [imageChangedEvent]="imageChangedEvent"
                                    [maintainAspectRatio]="false"
                                    [aspectRatio]="4 / 4"
                                    [resizeToWidth]="1000"
                                    [cropperMinWidth]="500"
                                    [roundCropper]="false"
                                    format="png"
                                    outputType="base64"
                                    (imageCropped)="imageCropped($event)"
                                    (imageLoaded)="imageLoaded()"
                                    (cropperReady)="cropperReady()"
                                    (loadImageFailed)="loadImageFailed()"
                                    [style.display]="showCropper ? null : 'none'"
                                ></image-cropper>
                              </div>
                              <br><br>
                              <label>{{translate.instant('TRANSLATOR.RESULTIMAGE')}}</label>
                              <br><br>
                              <img [src]="croppedImage" />
                              <br>
                              <br>
                              <button style="margin-top : 10px ;"  (click)="saveGallery()" class="btn btn-accent m-btn m-btn--air m-btn--custom">{{translate.instant('TRANSLATOR.SAVEIMAGE')}} </button>

                          </div>

这是Ts代码:

--- ts

imageCropped(event: ImageCroppedEvent) {
    this.croppedImage = event.base64;
    this.imageBase64 = event.base64 ;
  }

saveGallery()
  {
    this.saveToGallery(this.imageBase64) ;
  }

saveToGallery(base64)
  {
    this.data.upload_package_image(base64).subscribe(
      data =>{
        this.ngxService.stopLoader('loader-07');
        if(data['success'])
        {
          this.imageFile = basePath+'/'+ data['data'] ;
          this.data.upload_to_gallery(this.imageFile).subscribe(
            result => {
              console.log(result);
              window.location.reload();
            }
          )
        }
      }
    );
  }

有什么建议吗?

0 个答案:

没有答案