'Angular getting A client-side or network error occurred: Cannot read properties of undefined (reading 'viewContainerRef')

I am using the following forkJoin to make preview call only for attachment that can be previewable. canPreview flag shows that.

But as soon as I add the filter, it is throwing the following error. I am not using viewContaienrRef anywhere in this component. Can anyone help to find what am I doing wrong here?

'A client-side or network error occurred: Cannot read properties of undefined (reading 'viewContainerRef')'
    forkJoin(
            this.question.attachments
            .filter(attachment => attachment.canPreview) //error after adding this line
            .map((attachment) => {
                const { fileName, attachmentId, canPreview } = attachment;
                const attachmentUploadResult: AttachmentUploadResult = {
                    fileName,
                    attachmentId,
                    canPreview
                };
                return this.uploadService.getBlob(attachmentId).pipe(
                        map((blob) => {
                            return {
                                fileName,
                                attachmentId,
                                imageURL: this.sanitizer.bypassSecurityTrustUrl(
                                    URL.createObjectURL(blob)
                                ),
                                canPreview
                            } as AttachmentUploadResult;
                        }),
                        catchError(() =>
                            of(attachmentUploadResult)
                        )
                    );
            })
        )

Thanks



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source