How to display xml text in html in angular js

Question

I have some data in a row -

var xml = "<rss version='2.0'><channel><title>RSS Title</title></channel> </rss>" ; 

Now I want this line to be displayed on the web page in the appropriate XML format.

 <channel> <title> RSS Title </title> </channel> 

How can i do this?

Answer 1

I expected google-code-prettify to do the job, but it doesn't seem to indent. With an extra indent plugin (vkbeautify), able to get the correct indented xml format.

http://plnkr.co/edit/Pep9HurLI8NPtAXRsoFD?p=preview

 <div ng-controller="myCtrl"> <pre class="prettyprint lang-xml"></pre> </div> App.directive('prettyprint', function() { return { restrict: 'C', link: function postLink(scope, element, attrs) { element.text(vkbeautify.xml(scope.dom, 4)); } }; });