Nativescript: Refresh image with same src

[bigradish]

If the src of an Image tag keep same, while the image file is replaced (for example., by a user's uploading his new avatar), Nativesript still diaplay the old image.
Is there a way to refresh the image without changing its src?
Thank you.

[NickIliev]

NativeScript will refresh the UI when working with observables, however, in your case your image is cached. As the developer is controlling the way the user will change its photo what you can do is to create a new image with new image name and pass its path as a source (e.g. here) - instead of replacing the actual image file just create a new one and use it in your avatar photo binding.

Closing as a duplicate to https://github.com/NativeScript/NativeScript/issues/5493

[bigradish]

@NickIliev I know change the src can refresh the image, but my question is how to refresh the image without changing the src (i.e., refresh the image cache). Please answer my question!
Maybe the example you provide work on Nativescript + Angular, but it does not work on Nativesript + pure Javascript.
I think it might be better for you to provide a refresh method in the Image class to clear the cache and show the new image.
Thank you.

[NickIliev]

@bigradish our developer's team is currently reworking some of the image implementation and the feature to reload the image when the file has changed should be included in our next official release (4.x.x) - stay tuned for updates regarding this matter.

[bigradish]

@NickIliev Good news. This is the right answer. Thank you very much. :)

[nmandyam]

Is this available now? I see a remove function, but that needs a "key" that there's no documentation about. Using the original image URL as the key (which is the logical thing to do, I would think) in the remove does nothing, nor does clear (tns V 4.2.4, Android 7). What am I missing?

[ayrboy]

Any updates on this issue? I download images and use the same filename as the image src in a listview. The images are not reloaded unless the app is closed and re-launched.
Renaming the images is not a reasonable solution, it would cause many orphaned images to remain causing the need to run cleanup (not efficient)
We need to be able to clear the cache or instruct the view to reload the src.

[JCFowler]

@NickIliev
Hello,
I'm also having this issue, I'm running 5.x.x now, but I still can't seem to solve this issue.
And I can't seem to find anything online regarding this, other than this post.
Thank you

[Eonfuzz]

Was this ever followed up on?

[CarissaHurt]

Hey, I would also enjoy an update regarding this issue.

[JCFowler]

Hey @Eonfuzz , @CarissaHurt
I found a workaround that worked for me. (I'm using NativeScript 6, and Angular)

I added
[useCache]="false"
on the image tag, and when I update the image, i set the src to an empty string, and then setTimeout for 100 milliseconds and then set the src back to what it was.

HTML:
<Image [useCache]="false" [src]="path" (tap)="pictureTap()"></Image>

TS:
showImage() { this.path = ''; setTimeout(() => { this.path = this.filePathHelper.getFilePath('profile-pic.jpeg'); }, 100); }

[CarissaHurt]

@JCFowler
The useCache="false" worked really well for me. Thank you.

[michael-dots]

Having problem here as well. http headers says expiry 1 second, but never gets refreshed. tried useCache=false but that crashes in android emulator? No message or anything, app just closes.
NS 5.4.0