I am currently working with angular 5 and I am looking for a way to dynamically duplicate DOM templates using a custom pipe:
<div id="template" style="display:none;">
<a routerlink="{{parameter.route}}">here</a>
</div>
<nav> id="menuItem">
{{parameter.text | insertTemplatePipe }}
</nav>
The parameter.text field contains a value like this:
Please click {{insertTemplate}} to go to the next page.My objective is to use the pipe to replace the substring {{insertTemplate}} with the content of <div id="template"> and ensure that the routerlink functionality of the anchor tag works correctly.
I have come across information on how to access elements in components, as detailed here, but I am unsure how to implement this within a pipe.