How to display html display (not parsed) in angular2 template

Question

I am trying to create a sitemap for my application. Since I can not use the Sitemap generator.

I want to show something like this:

<url> <loc> http://www.fff.com </loc> </url> <url> <loc> http://www.fff.com/blog/23442 </loc> </url> 

That way I can copy and read in an XML file. I tried something like this:

 <code ngNonBindable> <url> <loc> http://www.fff.com/blog/23442 </loc> </url> </code> 

This will only be displayed: http://www.fff.com/blog/23442 .

Anyway, can I achieve this?

Answer 1

This is because html will be processed by elements. You must replace all < and > with < and > respectively:

 <code> &lt;url&gt; &lt;loc&gt; http://www.fff.com &lt;/loc&gt; &lt;/url&gt; &lt;url&gt; &lt;loc&gt; http://www.fff.com/blog/23442 &lt;/loc&gt; &lt;/url&gt; </code> 

Answer 2

 <pre> {{content}} </pre> 

  content = `<url> <loc> http://www.fff.com/blog/23442 </loc> </url>`; 

Plunger example