Insert HTML package templates in Angular2

After spending hours knocking weird rabbit holes with ngTemplateOutlets, componentFactoryResolvers and mixing with the oddities of ViewChild ... I think there should be a better way.

I have a component whose html template is getting big. Purely for organizational purposes, I would like to move some of the html to subpatterns (other files). I would just like to have one line in my main template to draw them in, but the scope and context for everything will remain the same.

I could make it work by completing everything in my own component, but that seems like a waste, and I will need @Output eventEmitters everywhere, also like waste.

The closest to the “good” I found is [innerHtml], but obviously this will not work, since Angular2 does not process the html that it inserts. I am sincerely surprised that there is no direct way to do this ... he does not need to think about any simple way to enter some inline text, which is processed as usual.

The optimal solution would look like

<div> all my regular content </div> <template [ngExternalTemplate]="./app/home/templates/my-template.html"></template> 

And all the html entered in this template will be accessible and accessible, all in the area and context, which will have a regular built-in html.

Any ideas on how to solve this? I hate to see how html becomes huge, but in fact it cannot be divided into several components, since they all control the same view.

As a last resort, I suppose I could replace the action a bit with gulp, but that seems like super hacks.

+6
source share
1 answer

You should split your template into components instead of creating a very large template. For your specific problem you will need a text preprocessor.

+1
source

Source: https://habr.com/ru/post/1014264/


All Articles