Cambié mi imagen de perfil en el proyecto Angular, y ya está guardada en el almacenamiento de Firebase, pero la imagen aún se muestra como antónimo, ¿alguien puede explicarme, por favor? Aquí está el archivo HTML y el archivo .ts. Se actualizó con éxito, pero la URL de la imagen me muestra una imagen antónima.

 <div class="container"> <article class="uk-comment"> <header class="uk-comment-header"> <div class="uk-grid-medium uk-flex-middle" uk-grid> <div class="uk-width-auto"> <img class="uk-comment-avatar" [src]="dataProfile.image" width="200" height="200" alt=""> </div> <button class="btn btn-info" data-bs-toggle="modal" data-bs-target="#exampleModal2">update image</button> </div> </div> </header> </article> </div> <div class="modal fade" id="exampleModal2" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">Modal title</h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> <form> <input type="file" accept=".jpg ,.png" (change)="uploadImage($event)"> <div *ngIf="persentages | async as pct"> <div *ngIf="pct == 100" class="alert alert-success" >Upload Successfully</div> <progress id="js-progressbar" class="uk-progress" [value]="pct" max="100" ></progress> </div> </form> </div> <div class="modal-footer"> </div> </div> </div> </div>

 uploadImage(event){ const id=Math.random().toString(36).substring(2) this.ref =this.fst.ref(id) this.task =this.ref.put(event.target.files[0]) this.persentages=this.task.percentageChanges() this.task.then((data)=>{ data.ref.getDownloadURL().then(url=>{ this.fs.collection("users").doc(this.dataProfile.uid).update({ image:url }) }) }).then(()=>{ window.location.reload() }) } }