filterPic: UploadFilter[] = [ //过滤器 上传列表数量的限制
{
name: ‘type‘,
fn: (fileListPic: UploadFile[]) => {
// var filetypes =[".jpg",".png",".rar",".txt",".zip",".doc",".ppt",".xls",".pdf",".docx",".xlsx"];
const filterFiles = fileListPic.filter(w => ~[‘image/png‘,‘image/jpeg‘,‘image/gif‘,‘image/bmp‘].indexOf(w.type));
// const filterFiles = fileLists.filter(w => ~["/txt","/doc"].indexOf(w.type));
if (filterFiles.length !== fileListPic.length) {
this.msg.error(`包含文件格式不正确,只支持image/png,image/jpeg,image/gif,image/bmp格式`);
return filterFiles;
}
return fileListPic;
}
},
{
name: ‘async‘,
fn: (fileListsPic: UploadFile[]) => {
return new Observable((observer: Observer<UploadFile[]>) => {
// doing
observer.next(fileListsPic);
observer.complete();
});
}
}
];
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
<div nz-row class="serveKey">
<div nz-col nzSpan="1"></div>
<div nz-col nzSpan="3" class="label">服务图标</div>
<div nz-col nzSpan="18">
<nz-upload
[nzFileType]="‘image/png,image/jpeg,image/gif,image/bmp‘"
[nzAction]="url + ‘/publish/upload/pic‘"
[nzFileList]="fileListPic"
[nzFilter]="filterPic"
nzMultiple
[nzLimit]="2"
(nzChange)="picChange($event)"
>
<button nz-button style="margin: 0;"><i nz-icon nzType="upload"></i><span>图片上传</span></button>
</nz-upload>
<span *ngIf="ngText&&publish.imagePath == ‘‘" style="margin-top:5px;display: block;color: #f5707a;">不能为空</span>
</div>
<div nz-col nzSpan="1">
<div *ngIf="publish.imagePath !== ‘‘" style="display:inline-block;vertical-align:middle;margin-left: 6px;">
<i nz-icon [nzType]="‘check-circle‘" [nzTheme]="‘twotone‘" [nzTwotoneColor]="‘#52c41a‘"></i>
</div>
</div>
</div>