HTML page

<nz-upload 
        nzAccept="application/pdf,image/jpeg,image/jpg,image/png"
        [(nzFileList)]="fileList"
        [(nzAction)]="UPLOAD_FILE"
        [nzShowButton]="fileList.length < 1"
        [nzBeforeUpload]="beforeUpload"
        (nzChange)="getFileUrl($event)" >
        <button nz-button>
            <i nz-icon nzType="upload"></i>
            <span>upload files</span>            
        </button>
</nz-upload>

TS file

 import { Component, OnInit } from '@angular/core';
 import { NzMessageService, NzModalService, UploadFile } from 'ng-zorro-antd';
    
 @Component({
     selector: 'app-detail',
     templateUrl: './detail.component.html',
     styleUrls: ['./detail.component.scss']
 })
 export class DetailComponent implements OnInit {
  	UPLOAD_FILE = ''; // File upload path
    constructor(
         private activeRoute: ActivatedRoute,
         private msg: NzMessageService,
         private router: Router,
         private message: NzModalService,
    ){ }
              
    fileList: UploadFile[] = [];
  	beforeUpload = (file: UploadFile): boolean => {
         // Judgment on the upload file type
         const type = file.type;
               
         const str = ['application/pdf', 'image/jpg', 'image/jpeg', 'image/png'];
              if (str.indexOf(type) < 0) {
                  this.message.warning({
                      nzTitle: 'Warning',
                      nzContent: 'Select file failed, only pdf, jpg, jpeg, png and other formats are supported'
                  });
                  return false;
              }
              // Limit on upload file size
              const isLt20M = file.size / 1024 / 1024 < 30;
              if (!isLt20M) {
                  this.message.warning({
                      nzTitle: 'Warning',
                      nzContent: 'The file must be less than 30M'
                  });
                  return false;
              }
              this.fileList = this.fileList.concat(file);
              // When the type and size meet the requirements, upload directly; if return false, then you need to call the upload method manually
              return true;
          }
          // Method to get the path when the file upload is finished     	 
      getFileUrl({ file, fileList }): void {
              const status = file.status;
              if (status === 'done') {
                this.zizhi_prove = file.response.data
              } else if (status === 'error') {
                this.msg.error(`${file.name} file upload failed.`);
              }
        }
  	}