typescript - Koristite Angular pipe za umetanje klonova DOM-a


Koristim Angular 5 i želim dinamički klonirati DOM predloške koristeći pipe:

<div id="template" style="display:none;">
   <a routerlink="{{parameter.route}}">here</a>
</div>

<nav> id="menuItem">
    {{parameter.text | insertTemplatePipe }}
</nav>

parameter.text sadrži vrijednost poput:

Please click {{insertTemplate}} to go to the next page.

I želim koristiti cijev (pipe) kako bih zamijenio podniz {{insertTemplate}} sadržajem <div id=template"> i što je najvažnije, očekujem da routerlink oznake radi.

Čitao sam o pristupu u komponentama, kao što je objašnjeno ovdje, ali kako to mogu postići u pipeu?

Odgovor #1

Cijevi pretvaraju nizove u nizove, nisu namijenjene za poznavanje DOM-a. Trebali biste stvoriti komponentu.

<menulink [text]="parameter.text"></menulink>

Samo "ng generate component MenuLink"

Dodajte svoj HTML u predložak i tekst kao unos u TypeScript.

@Input text;