Setting a default image in Html when the image unable to load (Angular)

Image Frames
Image Frames

Many time we want to set default image in html image tag when it unable to load given image. We can achieve this in angular as well as in HTML.

<img [src]='path' (error) ="onImgError($event)">

onImgError(event) { 
    event.target.src = 'assets/path_to_your_placeholder_image.jpg';
}

OR

Logitech G102 Light Sync Gaming Mouse
<img [src]='path' (error) ="$event.target.src = 'assets/path_to_your_image.jpg'">

OR

<img src='path' onerror ="this.src = 'assets/path_to_your_placeholder_image.jpg'">