im facing a problem when im trying to show image where the filename is having special characters like !23$%^&()image.png, the image wont be displayed because the style is not being applied, <div class="files border-t full_height" *ngFor="let file of files ; let last = last; let first = first"> <div class="files-container-preview"> <div *ngIf="file?.Extension =='.jpg' || file?.Extension == '.jpeg' || file?.Extension== '.gif' || file?.Extension =='.png' || file?.Extension =='.svg' || file?.Extension =='.bmp' || file?.Extension =='.tif' || file?.Extension =='.tiff' || file?.Extension =='.webp'; then images else other"> </div> <ng-template #images> <span class="attachment-container-preview-ext" *ngIf="file?.PreviewLink" [ngStyle]="{'background': 'url(' + file?.PreviewLink + ')'}"> </span> </ng-template> </div> </div> this is how the html is rendering this part when i add an image with special characters in the filename... i have tried changing it to [style.background]="'url(' + file?.PreviewLink + ')'"> and this doesnt work also, if i try to add the same image file renamed to something without special characters and spaces then the image is displayed. Continue reading...