2016-09-23 5 views
1

ブートストラップを使用してレコードの印刷数が53を超えるプレタグを印刷するのが難しく、印刷プレビューで常に空のページが表示されます。しかし、レコードが52未満の場合は、正常に印刷できます。以下の私のコードを見てください。 ブートストラップを使用すると余分な行を印刷するHTML前タグ

とコントローラ

appMain.controller('ctrlMain', ['$scope', function($scope) { 
$scope.fnPrintXMLData = function() { 
    window.print(); 
};}]); 

そして、私は印刷結果で

<html ng-app="appMain"> 
<head> 
    <script src="lib/angular.js"></script> 
    <script src="lib/moment.js"></script> 
    <script src="js/app.js"></script> 
    <link rel="stylesheet" href="css/bootstrap.css?v3.3"> 
</head> 
<body> 
    <div ng-controller='ctrlMain'>    
     <table> 
      <tr>     
       <td><button ng-click="fnPrintXMLData()"> Print </button></td> 
      </tr> 
     <table> 
     <label>test label</label> 
     <div class="clearfix">&nbsp;</div>       
     <span ng-show="message.id"><h4>Detail Message</h4></span> 
     <div class="clearfix">&nbsp;</div> 
     <pre class="printDisplayBox" style="white-space: pre-wrap; word-break: normal;"> 
     1 
     2 
     3 
     4 
     5 
     6 
     7 
     8 
     9 
     10 
     11 
     12 
     13 
     14 
     15 
     16 
     17 
     18 
     19 
     20 
     21 
     22 
     23 
     24 
     25 
     26 
     27 
     28 
     29 
     30 
     31 
     32 
     33 
     34 
     35 
     36 
     37 
     38 
     39 
     40 
     41 
     42 
     43 
     44 
     45 
     46 
     47 
     48 
     49 
     50 
     51 
     52 
     53 
     54 
     55 
     </pre> 
    </div> 
</body> 
はこれです: Printing with bootstrap 私は「コメントアウト」またはレコード数は、その後、以下の52の場合結果はOKです。 Printing without bootstrap

誰でもこのことを教えてください? ありがとうございました。

答えて

0

あなたのhtml:

<pre class="printDisplayBox" style="white-space: pre-wrap;word-break: normal;width: 100%;display: -webkit-inline-box !important;"> 
+0

うわー、それは正常に動作し、あなたは私に説明できますか?どうもありがとう。 – user2428424

+0

@ user2428424 sry私は説明できない、私は本当にそれを得る、ハハハ...私はちょうど試みている。 –

関連する問題