Static Assets

Learn how to use static assets in Angular.

We’re almost finished with developing the application. One problem we’ve been facing is the absence of images in each post. We can quickly resolve this by uploading some images to the src/assets directory. This is where we can upload assets, like images, that will be included with the project.

Where to download images

You can download this zip file for images.

Alternatively, you can find some royalty-free images on Picsum: https://picsum.photos/.

The src/assets directory

After downloading some files, you should upload them to the src/assets directory.

In this example, we have three files: image1.jpg, image2.jpg, and image3.jpg. We can load the images in the app by pointing the path to the assets directory. We can update the posts array in the app.component.ts to include the paths to the image. Specifically, we’re updating the img property in each object.

Get hands-on with 1200+ tech skills courses.