I'm using Angular 9 and have a question page where users can upload images for each question. When they do, they can instantly see the uploaded image. The [src] of the image always changes each time an image is uploaded. When the user enters question data and adds an image (uploads) sometimes a previous image is displayed even though the src path is correctly pointing towards the newly uploaded image -> if the user right-clicks the image and selects "Open image in new tab" it will correctly show the latest uploaded image and not the (cached) image displayed.

Any ideas? Thanks in advance

CodePudding user response：

For this case use state management method and dispatch every time when new image is uploaded, and get it from the store for displaying new images.

Refer this document: https://www.c-sharpcorner.com/article/state-management-in-angular-with-ngxs/

Dispatch like this as each time when image is being uploaded. this.store.dispatch(new AddProduct(this.img.list));

CodePudding user response：

Ok figured it out. The problem was related to the upload control which allowed multiple files to be uploaded at a time. Even though I was only allowing one file to be uploaded I needed to reinitialise the upload file array (to be = []) after each file was uploaded. Thanks again for your answers much appreciated.