My goal is to produce an HTML string that will be saved in a database and can be displayed in other angular apps.
I was able to get that string but any ng-repeats and ng-includes are still a part of that markup so when I try to display that HTML it essentially tries to compile it again and since there are no values within the ng-repeat or ng-bind it ends up not showing those pieces.
The markup is pretty much perfect if I can just get rid the ng-binding and ng-repeats, or possibly tell Angular to ignore the ng-repeats/ng-includes on the side I'm displaying them. Any ideas?
You can clean it by appending the html into a temporary element. Then manipulate those elements removing classes and attributes. When done return the innerHTML
var $el = angular.element('<div>').append(yourHtmlString); $el.find($el.querySelectorAll('[ng-repeat]').removeAttr('ng-repeat'); var result= $el.html();// raw non angular html
This is a bit oversimplified since you may also need to remove comments that angular uses as placeholders so is provided as concept only