Как изменить источник изображения, если возникла ошибка?

Question

Как изменить источник изображения, если возникла ошибка?

Почему следующий оператор выдает ошибку?

Идея: показать изображение с обычного URL-адреса. Если он не найден (404), покажите резервное изображение.

Работа выполнена:

<img [src]='image_path + item.leafname' (error) ="[src] = 'fallback_path + item.leafname'" height="200px" class="card-img-top">

Ошибка брошена:

Parser Error: Unexpected token '=' at column 7 in [[src] = 'image_path + item.leafname'] in ng:///AppModule/DashboardComponent.html@46:60

Другие ответы: я нашел альтернативные ответы на стек, который предлагает использовать ng-srcдля обычного изображения и onerror = "this.src='url'"для резервного изображения. Но как мне сделать то же самое с привязкой привязки [src] и (error)?

angular,

0

Ответов: 2

угловая,

Похожие вопросы

score 1 · Accepted Answer

1 принят

Вы должны реализовать эту логику в компоненте, а не в шаблоне.

Затем измените свой шаблон так:

<img [src]='image_path + item.leafname' (error) ="changeSource($event, item.leafname)">

Затем создайте обработчик ошибок, например:

changeSource(event, name) { event.target.src = this.fallback_path + name; }

Что обновляет источник изображения в резервном источнике.

score -1 · Accepted Answer

-1

Попробуй это:

if(typeof(src)==="undefined")
{
$("#imageID").attr("src","yourNewSource_goes_here");
}

Если это не сработает, вы можете попробовать следующее:

if(document.getElementById("myImg").complete==false)
{
$("#myImg").attr("src","another_source_goes_here");
}