Search code examples
angularangular2-components

Alternative to forwardRef in newer Angular versions?


I'm trying to update an old project to the latest version of Angular and I discovered that this line

constructor(@Inject(forwardRef(() => MapComponent)) private map: MapComponent) {}

causes the app to be stuck on Loading....

TSLint also gives me the following message:

Avoid using forwardRef() in class (no-forward-ref).

How can I rewrite this constructor?


Solution

  • It sounds like you have a circular dependency in your injection setup. forwardRef is there to resolve some of these types of issues as classes aren't hoisted and this can cause some type instance resolution errors. You are getting the tslint error because the style guide suggests that you restructure your app to not have dependency resolution issues rather than rely on forwardRef.

    If someone has added forwardRef earlier in your code, then it is probably for a reason - so removing it will possibly give you a different error. I would try to hoist the MapComponent in the code and then remove the forwardRef declaration - as I suspect some other issue is at the root of a stalled bootstrap in this instance