bounty将在4天后过期。回答此问题可获得+100的声望奖励。IonicMan希望吸引更多人关注此问题：我不是在问如何创建一个后备图片。如果背景图片被破坏了，我怎么能在不发出网络请求的情况下检查我的代码呢？
我有一个Angular 7应用程序，在其中我显示了一个div背景图像。但有时链接是坏的。
我的图像在HTML中绑定为
<div [ngStyle]="{'background-image': 'url(' + row?.coverUrl + ')', 'background-size': 'cover', 'background-position' : 'center'}" class="img-area cursor-pointer" (click)="navigateToCOmpany(row)" *ngIf="row.coverUrl !== ''">
</div>问题是有时候row?.coverUrl是断链的。那么我如何检测到断链，以便我可以绑定一个默认图像呢？
1条答案
按热度按时间s5a0g9ez1#
若要检测Angular中的图像URL是否损坏，可以使用ErrorEvent类和Image元素上的error事件。可以将error事件绑定到组件中的事件处理函数，并在图像加载失败时使用此函数设置默认图像URL。
下面是一个如何在Angular应用中实现这一点的示例：
第一个
在此示例中，currentImageUrl属性用于存储应在div元素的背景中显示的当前图像URL。当在img元素上触发error事件时，将调用imageError（）函数，并将currentImageUrl更新为默认图像URL。这可确保在图像加载失败时显示默认图像。