can't access lexical declaration '...' before initialization", errorSource: ReferenceError

I have a component that lists items. This component is included in a modal dialog and also on a page/component in the app routes and is loaded dynamically. The modal version loads fine but the page will only load if the dialog is loaded first. Everything is standalone components.

The problem component use Material Dialogs. If I comment out the body of those methods where the dialog is opened then the component loads and displays the grid/list.

eg:

editThing(): void {
// const d = this.dialog.open(ThingDialogComponent, {
// data: { ...
// }
// });

// d.afterClosed().subscribe(async _ => { ...
// });
}


There methods are event handlers and are not called during initialisation.

The template does not use any Material components so I dont have it in the imports.

This is ng 18.

Anyone got a clue?

Thanks

Continue reading...