Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

generating html css source code by angular javascript or anything else

I build a drag & drop HTML Layout generator using Angular.js. Now I want to save generated HTML,CSS source code removing angular.js code from only the design. Is their any solution for generating HTML, CSS code using angular.js?

like image 571
Mahsin Avatar asked Apr 12 '15 12:04

Mahsin


1 Answers

Here you can use jquery to get your html like as

var allContent = $('.page-content').clone();

Remove extra tag by this way

//remove all angular class
allContent.find("div[class^='ng-'],div[class*='ng-']").each(function () {
   //check and remove class
});

//remove all ng-model attribute ans so no
allContent.find('*[ng-model]').removeAttr('ng-model');

Clean your html and get all html

allContent.htmlClean();
var customPageContent = allContent.html();

and finally save this by using https://github.com/eligrey/FileSaver.js

var blob = new Blob([customPageContent], {
                type: "application/xhtml+xml;charset=charset=utf-8"
            });
saveAs(blob, fileName + ".html");

Extra function

//clear your html
$.fn.htmlClean = function () {
    this.contents().filter(function () {
        if (this.nodeType != 3) {
              $(this).htmlClean();
              return false;
          } else {
              this.textContent = $.trim(this.textContent);
              return !/\S/.test(this.nodeValue);
          }
      }).remove();
      return this;
};

I think this will help you.

like image 193
Shohel Avatar answered Oct 19 '22 00:10

Shohel