I've dynamically created an Angular 2 component using DynamicComponentLoader.loadAsRoot(), and am trying to give it a useful template (involving NgFor), but this is somehow yielding me a 'DI exception' dependency injection error.
I had already injected NgFor itself though, so specifically now it gave me a No provider for IterableDiffers! (NgFor -> IterableDiffers). So I injected that, which got me to a No provider for Array! (NgFor -> IterableDiffers -> Array). At this point I got stumped; Array is a base type rather than something part of Angular, and somehow trying to similarly inject it did not work (error: Array is a generic; must specificy some sub-type). I'm confused but I'd be surprised if basic types suddenly required injection.
I made a Plunker to recreate my issue here. Interestingly on Plunker the DI exception turned out as No provider for e! (e -> e) instead. Not sure why the difference, but the principle issue would seem similar... though e gives me even less useful info to go by than Array. :(
How might I prevent such exceptions here?
loadAsRoot(), while actually getting theNgForresult to show would require adding a timeout toChangeDetectorRef.detectChanges()in the child component... which even if it works seems like an unfortunate hack, so still trying to figure out whether that's as it should be...detectChangesworks but is pretty annoying. Not to mention hella confusing when you're not yet aware what went wrong or how to address it...