将所有内容,设计/ CSS从HTML打印到PDF

时间:2016-09-09 17:34:14

标签: html css angularjs pdf

我的HTML页面的屏幕截图

http://i.stack.imgur.com/D7V0V.jpg

我的PDF屏幕截图

http://i.stack.imgur.com/AAZ5M.jpg

我想在“PDF”上准确打印“HTML”页面的详细信息 我使用'jsPDF'将详细信息打印到PDF

这是我的jsPDF代码:

var pdf = new jsPDF('p', 'pt', 'a4');
var source = $('#mymy')[0];
var specialElementHandlers = {
// element with id of "bypass" - jQuery style selector
'#bypassme': function(element, renderer){
    // true = "handled elsewhere, bypass text extraction"
    return true
  }
}

var margins = {
   top: 80,
   bottom: 60,
   left: 40,
   width: 522
};


pdf.fromHTML(source, margins.left, margins.top, {
    'width': margins.width // max width of content on PDF
    , 'elementHandlers': specialElementHandlers
},
function (dispose) {
  // dispose: object with X, Y of the last line add to the PDF 
  //          this allow the insertion of new lines after html
  pdf.save('Test.pdf');
},
margins
)

HTML网页代码:

 <div class="form-group" id="mymy">
                <ul ng-repeat="sec in abc" class="media-list tab-pane fade in active" style="border-style: solid;">

                    <ul ng-repeat="k in sec.usertype" ng-if="secs(k._id)">
                        <div class="panel panel-primary">
                        <div class="panel-heading">{{k.sec_name}}</div> 
                            <div class="panel-body">

                            <ul ng-repeat="l in k.keywords">                           

                            <div class="row" name="options" id="{{k._id}}" ng-if="check(l._id)">
                           <div class="col-sm-5"> <img src="/client/app/images/t.png" width="20" height="15"><b>{{l.keyword}}</b></div>
                             <div class="col-sm-5"> <p>{{l.description}}</p></div>                                                              
                            </div>                            

                        </ul>
                                </div>
                        </div>
                    </ul>                       

                </ul>       
                </div>

我希望在PDF上打印确切的HTML页面 我也尝试了内联CSS,但仍然存在同样的问题。

0 个答案:

没有答案