convert regular a tag to routerlink

Question

I have HTML in a string coming from the server:

str = '<div>The linkL <a href="/en/about">About</a></div>';

This is just an example, I have a really long HTML with a lot of links.

in the template I have this

 <div innerHTML="str"></div>

Everything works fine, except that when someone clicks on the link the entire page reloaded, I need routerLink to replace all the <a tags.

Is it possible? Thanks

This isn't really possible unless you load the component using Dynamic Component Loader. Just using `innerHTML` won't compile the html and will render it as is. So even if you replace the `href`s as `routerLink` it won't really work. Are there links routes to the application itself? — SiddAjmera, Nov 28 '18 at 15:27
you can use `router.navigate` to navigate to those routes in the click event of the hyperlinks — Niladri, Nov 28 '18 at 15:32

score 2 · Answer 1 · answered Nov 28 '18 at 15:23

2

Its not the <a> tag that makes the page reload, its the href attribute in it. Replace href with routerLink like this:

<a routerLink="/en/about">About</a>

To get that from the string, you can use: str.replace("href", "routerLink");

answered Nov 28 '18 at 15:23

Aragorn

1

Thanks. But this is not possible. InnerHTML makes the content HTML – SexyMF Nov 28 '18 at 20:29

1 Answers1