HTML image not displaying even though the path in the img tag is correct

Issue

I am trying to display an image in my Angular project using HTML. The code is shown below

<img src="../../../../../Uploads/1640665063123--hc-Freeport.jpg" alt="Test">

I have verified that the link is correct. The file type is also correct. Additionally, the image has not been corrupted in any way since I can open it in Photos, Visual Studio Code, and Google Chrome. However, the image does not load in HTML. Instead, the "Test" text is shown. Can anyone give me some advice? Am I missing something?

The links below show the structure of my project. The second link shows the file in which the home-page component is located, which is where the image is supposed to be displayed.

https://ibb.co/Qj8HZy5

https://ibb.co/4JSk8g2

Solution

Try putting the image file in assest folder and use this path,

<img src="assets/Uploads/1640665063123--hc-Freeport.jpg" alt="Test">

Answered By - lakshna S