sanjayV/ng-image-slider

ng-image-slider not working properly when SafeURL object is being passed in

Closed this issue · 1 comments

So I have the following code:

            const response = await this.httpClient
                .get(
                    `https://picsum.photos/200?query=${i}`,
                    { responseType: 'blob' }
                ).toPromise().catch(error => console.log(error));

            if (!response) {
                return;
            }
            
            const blob = new Blob([response], { type: 'application/image' });
            const unsafeImg = URL.createObjectURL(blob);

            this.images.push({
                image: unsafeImg,
                thumbImage: unsafeImg,
                alt: `Image ${i}`
            });

Ideally I should be able to do something like const imageUrl = this.sanitizer.bypassSecurityTrustUrl(unsafeImg); and pass the imageUrl variable into the 'image' property (same goes for 'thumbImage'). Right now if I try to pass SafeUrl object into those properties, I get blank images and SafeValue must use [property]= message when inspecting them.

Screen Shot 2021-06-21 at 11 08 13 PM

I guess I can live without passing SafeUrl in.