0

I'm dynamically loading components into my menu bar using DynamicComponentLoader.

This is what my component class looks like:

@Component({
  selector: 'create-submenu-component',
  templateUrl: 'common/create/create.component.html',
  styleUrls: ['common/create/create.component.css'],
  directives: [CreateAssetComponent]
})
export class CreateSubmenuComponent {
  public model: Model;

  constructor(private _modelService:ModelService, public http: Http) {
    this.model = this._modelService.getModel();
  }
}

And the dynamic component creation method:

constructor(public injector:Injector){}

loadCreateSubMenu(){
  this.dcl.loadAsRoot(CreateSubmenuComponent, '#Create', this.injector);
}

When I'm trying to load the component that contains the Service I'm getting the following error:

Cannot resolve all parameters for 'CreateSubmenuComponent'(undefined, Http). Make sure that all the parameters are decorated with Inject or have valid type annotations and that 'CreateSubmenuComponent' is decorated with Injectable.

The Service being injected is showing up as undefined. Submenu Components that do not rely on a Service load fine. How do I inject the service into the dynamically created component?

BrentShanahan
  • 681
  • 1
  • 7
  • 17
  • Where does `this.injector` come from? – Günter Zöchbauer May 02 '16 at 18:10
  • Edited to reflect where this.injector is coming from. My use of DynamicComponentLoader was pulled from the example on the Angular2 site: https://angular.io/docs/js/latest/api/core/DynamicComponentLoader-class.html – BrentShanahan May 02 '16 at 18:20
  • Have you tried not passing the injector? – Günter Zöchbauer May 02 '16 at 18:21
  • Yes, it gives the same error. I'm wondering if using LoadNextToLocation instead of LoadAsRoot would work with ModelService placed in the providers location? I think I need to dig into the code base to understand what DynamicComponentLoader is actually doing. – BrentShanahan May 02 '16 at 18:26
  • 1
    `loadAsRoot` is built only for bootstrapping root. For DCL you can have a look at http://stackoverflow.com/questions/36325212/angular-2-dynamic-tabs-with-user-click-chosen-components/36325468#36325468 (beta.16 version). For making `loadAsRoot` work see https://github.com/angular/angular/issues/6370#issuecomment-193896657 – Günter Zöchbauer May 02 '16 at 18:29
  • Great information, thank you! – BrentShanahan May 02 '16 at 18:44

0 Answers0