需求
将图片的相对路径作为参数请求接口返回一个图片URL,这样直接放到img标签上面渲染图片,由此想到使用自定义管道的功能;
实现
// minio.pipe.ts
import { Pipe, PipeTransform } from '@angular/core';
import { _HttpClient } from '@delon/theme';
import { lastValueFrom } from 'rxjs';
import { NzMessageService } from 'ng-zorro-antd/message';
@Pipe({ name: 'minioFormat' })
export class MinioPipe implements PipeTransform {
constructor(private http: _HttpClient, private msg: NzMessageService) {}
async transform(value: string): Promise<string> {
const res = await this.getMinioUrlPromise(value);
if (res.ret === '-1') {
this.msg.error(res.desc);
return;
}
return res.data;
}
getMinioUrlPromise(fileUrl: string) {
return lastValueFrom(
this.http.post('/pc/sysservice/queryShareUrl', {
obj: {
fileUrl,
},
}),