fix(module:image): preview the local upload image error (#7615)

components/image/image-preview.component.ts

@@ -16,6 +16,7 @@ import {
   ViewChild,
   ViewEncapsulation
 } from '@angular/core';
+import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
 import { fromEvent } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
 
@@ -75,7 +76,7 @@ const initialPosition = {
                 class="ant-image-preview-img"
                 #imgRef
                 *ngIf="index === imageIndex"
-                [attr.src]="image.src"
+                [attr.src]="sanitizerResourceUrl(image.src)"
                 [attr.srcset]="image.srcset"
                 [attr.alt]="image.alt"
                 [style.width]="image.width"
@@ -197,7 +198,8 @@ export class NzImagePreviewComponent implements OnInit {
     public nzConfigService: NzConfigService,
     public config: NzImagePreviewOptions,
     private overlayRef: OverlayRef,
-    private destroy$: NzDestroyService
+    private destroy$: NzDestroyService,
+    private sanitizer: DomSanitizer
   ) {
     this.zoom = this.config.nzZoom ?? 1;
     this.rotate = this.config.nzRotate ?? 0;
@@ -347,6 +349,10 @@ export class NzImagePreviewComponent implements OnInit {
     }
   }
 
+  sanitizerResourceUrl(url: string): SafeResourceUrl {
+    return this.sanitizer.bypassSecurityTrustResourceUrl(url);
+  }
+
   private updatePreviewImageTransform(): void {
     this.previewImageTransform = `scale3d(${this.zoom}, ${this.zoom}, 1) rotate(${this.rotate}deg)`;
   }