UI: Improve image pipe. Resolve final image data inside NgZone.

This commit is contained in:
Igor Kulikov 2023-12-11 19:18:55 +02:00
parent 930ec47649
commit 90454b04a3

View File

@ -14,7 +14,7 @@
/// limitations under the License.
///
import { Pipe, PipeTransform } from '@angular/core';
import { NgZone, Pipe, PipeTransform } from '@angular/core';
import { ImageService } from '@core/http/image.service';
import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
import { AsyncSubject, BehaviorSubject, Observable } from 'rxjs';
@ -35,7 +35,8 @@ export interface UrlHolder {
export class ImagePipe implements PipeTransform {
constructor(private imageService: ImageService,
private sanitizer: DomSanitizer) { }
private sanitizer: DomSanitizer,
private zone: NgZone) { }
transform(urlData: string | UrlHolder, args?: any): Observable<SafeUrl | string> {
const ignoreLoadingImage = !!args?.ignoreLoadingImage;
@ -49,15 +50,19 @@ export class ImagePipe implements PipeTransform {
const preview = !!args?.preview;
this.imageService.resolveImageUrl(url, preview, asString, emptyUrl).subscribe((imageUrl) => {
Promise.resolve().then(() => {
this.zone.run(() => {
image$.next(imageUrl);
image$.complete();
});
});
});
} else {
Promise.resolve().then(() => {
this.zone.run(() => {
image$.next(asString ? emptyUrl : this.sanitizer.bypassSecurityTrustUrl(emptyUrl));
image$.complete();
});
});
}
return image$.asObservable();
}