使用 Primeng 头像时无法 bing blob 图片

Question

官方doc中的图片是从assets目录中选取的

        <div class="card">
            <h5>Image - Badge</h5>
                <p-avatar image="assets/showcase/images/demo/organization/walter.jpg" pBadge value="4" severity="danger" styleClass="mr-2" size="xlarge"></p-avatar>
        </div>

我将从我的组件中获取图像（blob 图像）。

    let imageBlog = await (response as any).blob().catch(this.unhandledFetchError); // Get image data as raw binary data

    this.photo= URL.createObjectURL(imageBlog)

<p-avatar [image]='photo'></p-avatar>

没用

当我在浏览器中打开图片时，我看到了。

Answer 1

可能需要消毒

this.photo = this.sanitizer.bypassSecurityTrustUrl(URL.createObjectURL(imageBlog))

注射消毒剂

constructor(private sanitizer: DomSanitizer) {}

使用 Primeng 头像时无法 bing blob 图片

Unable to bing blob image when using Primeng avatar

primeng

angular