本文介绍了当IMG在角7中URL的Asest文件夹中不可用时如何处理错误404的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
img标记在img不可用时抛出错误404,而不是抛出错误,我想要一个用户名为第一个字符的avtar图像。假设用户名Ravi Than R应该出现而不是错误 我已尝试使用布尔标志,但它不适用于我在alt属性list.name.charAt(0)中尝试的第一个字符 但是,img错误仍在继续 <ion-item lines="none">
<ion-thumbnail slot="start" rounded >
<ion-img [src]="'assets/icon/' +list?.type+ '.png'" >
</ion-img>
</ion-thumbnail>
<ion-text slot="end"></ion-text>
<ion-button (click)="doAdd(list.type ,'')" slot="end">
Add link
</ion-button>
</ion-item>
当img不可用时,输出应该是用户名称的第一个字符,而不是错误
推荐答案
镜像有onerror
属性,对于ion是ionError
(参见docs),可以用来执行代码。
<img [src]="'assets/icons/'+list?.type+'.png'" (ionError)="handleError(i)">
在那里,您可以改为为您的图像设置替代的src
属性。
export class MyPage {
list: YourListType[];
handleError(index: number) {
this.list[index].type = 'alternative-image-name';
// note that in your template you concat that with the `assets/icon` path and the .png ending
}
}
这篇关于当IMG在角7中URL的Asest文件夹中不可用时如何处理错误404的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!