typescript - Použiť Angular pipe na vloženie klonov DOM


Používam Angular 5 a chcem dynamicky klonovať šablóny DOM pomocou pipe:

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

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

parameter.text obsahuje hodnotu, ako napríklad:

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

A chcem použiť pipe na nahradenie podreťazca {{insertTemplate}} obsahom <div id=template"> a čo je najdôležitejšie, očakávam, že routerlink kotvy bude fungovať.

Čítal som o prístupe v komponentoch, ako je to vysvetlené tu, ale ako to môžem dosiahnuť v pipe?

Odpoveď č. 1

Rúry premieňajú reťazce na reťazce, nemajú byť určené na poznanie DOM. Mali by ste vytvoriť komponent.

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

Len „ng generate component MenuLink“

Pridajte svoj HTML do šablóny a text ako vstup v TypeScripte.

@Input text;