Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Cannot read properties of undefined (reading 'instance') at DialogService.getInstance #14856

Open
sibinxsimelabs opened this issue Feb 22, 2024 · 10 comments
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Milestone

Comments

@sibinxsimelabs
Copy link

Describe the bug

getInstance method product Cannot read properties of undefined (reading 'instance') at DialogService.getInstance error. So component not displaying .
Same can be reproduce in PrimeNG dynamic dialog example

Environment

Development

Reproducer

https://stackblitz.com/edit/nga6lg

Angular version

17.1.X

PrimeNG version

17.7.X

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.9.0

Browser(s)

Edge

Steps to reproduce the behavior

  1. Create Dynamic dialog
  2. With/Without data
  3. Inside constructor , try to call getInstace method

Expected behavior

It should not throw any error and show dynamic dialog component

@sibinxsimelabs sibinxsimelabs added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Feb 22, 2024
@mehmetcetin01140 mehmetcetin01140 added Type: Bug Issue contains a bug related to a specific component. Something about the component is not working and removed Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible labels Feb 26, 2024
@THammami01
Copy link

Encountering the same problem as well.

@salvatoremadonia
Copy link

salvatoremadonia commented May 31, 2024

same problem and i solved with:

this.instance = this.dialogService.dialogComponentRefMap.get(ref)?.instance;

@THammami01
Copy link

same problem and i solved with:

this.instance = this.dialogService.dialogComponentRefMap.get(ref)?.instance;

@salvatoremadonia Didn't solve it for me.

@eldonato
Copy link

If what you want is the config object passed on the dialogService.open method, you can workaround by passing a DynamicDialogConfig in the constructor of the component you're opening.

Something like this:

@Component({
  standalone: true,
  imports: [DynamicDialogModule],
  selector: 'app-dialog-test',
  providers: [DialogService],
  template: `<p>{{ config.data.message }}</p>`
})
export class DialogTestComponent {
  constructor(private ref: DynamicDialogRef, public config: DynamicDialogConfig ) { }
}

@THammami01
Copy link

Thanks! This solves the problem.

image

@B34v0n
Copy link

B34v0n commented Jun 18, 2024

I got the same error, but my dialog shows it's content. My error is in the following method: https://github.com/primefaces/primeng/blob/master/src/app/components/dynamicdialog/dynamicdialog.ts#L329

loadChildComponent(componentType: Type<any>) {
        let viewContainerRef = this.insertionPoint?.viewContainerRef;
        viewContainerRef?.clear();

        this.componentRef = viewContainerRef?.createComponent(componentType);
        this.dialogRef.onChildComponentLoaded.next(this.componentRef!.instance);
    }

this.componentRef is undefined.

@tobika
Copy link

tobika commented Aug 9, 2024

In case this helps someone, I completely forgot to import my custom dialog component (standalone) in the component that was opening the dialog. Angular rendered the template but it was not functional and there was no error in the console 😅

@bernhardpointner
Copy link

I got the same error, but my dialog shows it's content. My error is in the following method: https://github.com/primefaces/primeng/blob/master/src/app/components/dynamicdialog/dynamicdialog.ts#L329

loadChildComponent(componentType: Type<any>) {
        let viewContainerRef = this.insertionPoint?.viewContainerRef;
        viewContainerRef?.clear();

        this.componentRef = viewContainerRef?.createComponent(componentType);
        this.dialogRef.onChildComponentLoaded.next(this.componentRef!.instance);
    }

this.componentRef is undefined.

This problem still remains. viewContainerRef is optional and hence, also this.componentRef. Whereas in the last line, they assume with ".componentRef!.instance" that componentRef exists for sure.

@bernhardpointner
Copy link

bernhardpointner commented Dec 4, 2024

Bug still is still there.

@rainergp
Copy link

rainergp commented Dec 4, 2024

Is there any fix or workaround for this bug so far?

@mertsincan mertsincan added this to the 19.0.2 milestone Dec 25, 2024
@github-project-automation github-project-automation bot moved this to Review in PrimeNG Dec 25, 2024
@cetincakiroglu cetincakiroglu modified the milestones: 19.0.2, 19.0.4 Dec 26, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Projects
Status: Review
Development

No branches or pull requests