Upload上传

import { Component, Input, Output, EventEmitter, Inject } from '@angular/core';import { NzMessageService, UploadFile, UploadFilter, UploadXHRArgs } from 'ng-zorro-antd';import {    HttpRequest,    HttpClient,    HttpEventType,    HttpEvent,    HttpResponse} from '@angular/common/http';import { forkJoin } from 'rxjs';import { HttpService } from './httpService';export class File {    uid: '';    name: '';    status: 'done';    url: '';}export class UploadFileType {    'fileId': '';    'fileName': '';    'fileSize': '';    'fileUrl': '';    'sequence': '0';}@Component({    selector: 'UploadPictureCardComponent',    template: `    
             
              
      
       Upload
      
        
      
       文件上传中{
   {progress}}...
      
    
       `})export class UploadPictureCardComponent {

fileList: File[] = [];

uploadFiles: UploadFileType[] = [];

previewImage = '';

previewVisible = false;

progress = ''; //上传进度

@Input() childIsLoad;

@Input() flieSessionStoragesName; //文件存在sessionStorage中的键值

@Output() private childOuter = new EventEmitter(); //子组件向父组件传值

@Output() private childIsLoadOuter = new EventEmitter(); //告诉父组件是否上传中

constructor(        private msg: NzMessageService,        private httpService: HttpService,        @Inject('urlConfig') public urlConfig    ) {}    ngOnInit() {        //初始化文件    }    //上传限制    filters: UploadFilter[] = [        {            name: 'type',            fn: (fileList: UploadFile[]) => {                const filterFiles = fileList.filter(                    w =>                        ~['image/png', 'image/jpg', 'image/gif', 'image/bmp', 'image/jpeg'].indexOf(                            w.type                        )                );                if (filterFiles.length !== fileList.length) {                    this.msg.create('error', '请上传png、jpg、gif、bmp、jpeg格式的图片!');                    return filterFiles;                }                return fileList;            }        }    ];    //上传之前的操作    beforeUpload = (file: File) => {        let ispass = true; //是否继续往下执行        console.log('上传之前的操作');        //以下操作在        if (window.sessionStorage.getItem(this.flieSessionStoragesName)) {            let list_ = JSON.parse(window.sessionStorage.getItem(this.flieSessionStoragesName));            for (let i in list_) {                if (file.name == list_[i].fileName) {                    ispass = false;                    this.msg.create('warning', '请勿上传同名文件！');                    break;                }            }        }        return ispass; //返回true继续执行，false直接停止    };    //开始、上传进度、完成、失败都会调用这个函数    handleChange(info: any): void {        console.log(info);        if (info.type == 'start') {            this.childIsLoadOuter.emit(true); //告诉父组件上传中            this.progress = '0%';        }        if (info.type == 'progress') {            this.progress = info.event.percent.toFixed(2) + '%';        }        if (info.type === 'success') {            this.progress = '';            console.log(info);            let file = new UploadFileType();            file.fileId = info.file.response['data'].id;            file.fileName = info.file.response['data'].name;            file.fileSize = info.file.response['data'].size;            file.fileUrl = info.file.response['data'].downloadUrl;            file.sequence = '0';            this.childOuter.emit(file); //向父组件传值            this.childIsLoadOuter.emit(false); //告诉父组件上传完成            this.msg.create('success', '上传成功！');        }        if (info.type === 'error') {            this.childIsLoadOuter.emit(false); //告诉父组件上传完成        }    }}