Geek Answers Handbook

Getting compiled HTML from AngularJS

I am having problems getting a compiled html page in AngularJS. Here is the code:

JS:

<script src="http://code.angularjs.org/1.2.0rc1/angular.min.js"></script> <script> var app = angular.module('main', []); app.directive("compile", ['$compile', function ($compile) { return { link: function(scope, elem, attr){ var compiledHTML = $compile(elem.contents())(scope); console.log(compiledHTML); var returnString = ''; for(i=0; i<compiledHTML.length; i++) returnString += compiledHTML[i].outerHTML; console.log(returnString); } }; }]); </script>

HTML:

 <html ng-app="main" compile> <body> {{3 + 4}} </body> </html>

Which is strange in the first console.log (), it shows the compiled data, 7, in the outerHTML property, but when I output all .outerHTML, it shows the uncompressed version, {{3 + 4}}

+7
javascript angularjs
source share
1 answer

It seemed like a matter of time. Waiting for compiled HTML to do the trick.

 $timeout(function(){ var returnString = ''; for(i=0; i<compiledHTML.length; i++) returnString += compiledHTML[i].outerHTML; console.log(returnString); },0);
+12
source share

More articles:


All Articles