4

I am working with angular 2 rc4 and we are using fuel-ui http://fuelinteractive.github.io/fuel-ui/#/ to load a modal.

What we are trying to achieve is the following:

we have a login component that we want to inject into the fuel-ui modal the problem is that the actual modal html code (actual DOM) is getting loaded after.

Fuel-ui gives a tag into which the html for the modal gets loaded into.

I have researched and tried DynamicComponentLoader although found out it is now deprecated.

What I need is to know what is the best way to inject my login component content into the rendered DOM (tag with modal-body class from bootstrap html).

I have searched but perhaps someone had the same issue and stumbled upon a better link that explains how to do this.

Thank you, in advance, for your help.

Nancy

Nancy Hebert
  • 41
  • 2
  • You can use `ViewContainerRef.createComponent()` instead of DCL. For an example with Plunker see http://stackoverflow.com/questions/36325212/angular-2-dynamic-tabs-with-user-click-chosen-components/36325468#36325468 – Günter Zöchbauer Aug 08 '16 at 14:10

1 Answers1

0

This seems very old now. But i think the latest in Angular helps you use content projection into a component.

You can add <ng-content></ng-content> as the body of your modal. In the parent component view add your custom component wrapped in the modal component. When modal shows up, you will have your component in it's content.

Also, Angular supports dynamic component creation.

Component templates are not always fixed. An application may need to load new components at runtime.

You can look it up here for any help: dynamic-component-loader

nircraft
  • 8,242
  • 5
  • 30
  • 46