が適切に私は動的データと自分のアプリケーション内のテーブルを持っているangularjs

Question

を使用してテーブルを印刷に失敗、ここ

は私のコントローラ

$scope.printDiv = function (printable) { 
     var printContents = document.getElementById(printable).innerHTML; 
     var popupWin = window.open('', '_blank', 'width=300,height=300'); 
     popupWin.document.open(); 
     popupWin.document.write(printContents); 
     popupWin.document.close(); 
    } 

、私はテーブルを印刷しようとした方法です

私のテーブル

 <table class="table table-bordered" id="printable"> 
      <thead> 
       <tr class="bg-primary"> 
        <th>Task Name</th> 
        <th>Start Date</th> 
        <th>End Date</th> 
        <th>Started BY</th> 
        <th>Priority</th> 
        <th>Action</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="d in dataintbl | orderBy:sortType:sortReverse | filter:searchFish" ng-class="{'changecolor':(d.IsCompleted=='True')}"> 
        <td><a href="#" style="cursor:pointer;" ng-click="showdetails(d)" data-toggle="modal" data-target="#myModalc">{{d.taskname}}</a></td> 
        <td>{{d.taskstartdate}}</td> 
        <td>{{d.taskenddate}}</td> 
        <td>{{d.startedby}}</td> 
        <td ng-class="{'greenrow': (d.taskpriority == 'Low'), 'yellowrow': (d.taskpriority == 'Medium'), 'redrow': (d.taskpriority == 'High')}">{{d.taskpriority}}</td> 
        <td> 
         <span ng-class="{'hidespan':(d.IsCompleted=='False')}">Completed</span> 
         <div ng-class="{'hidebutton':(d.IsCompleted=='True')}"> 

          <a href="#" ng-click="updatetask(d)" data-toggle="modal" title="EDIT TASK" data-target="#myModalb" class="btn btn-warning glyphicon glyphicon-edit"></a> 
          <a href="#" ng-click="deleteuser(d)" title="DELETE TASK" class="btn btn-danger glyphicon glyphicon-trash"></a> 
          <a href="#" ng-click="taskcompleted(d)" title="COMPLETE TASK" class="btn btn-success glyphicon glyphicon-ok"></a> 
         </div> 
        </td> 
       </tr> 
      </tbody> 
     </table> 

が、問題はこれが適切に私のテーブルを印刷していないで、私が同じためjsfiddleを作成している

のdivに適切なスタイルを与えることができない

here is my jsfiddle

ここに私を助けてください

私の主なprobleが（これは表のように見ていない、私の隠されたフィールドもまた、虚偽のデータを示し、私はNG-クラスを使用するフィールドを印刷している）されて

彼女の私を助けてくださいe、

Answer 1

ちょっとしたコードをhtmlで更新しました。 document.write（）メソッドはテーブルタグを取得していないので、printContentsオブジェクトは字句的に間違っていて文字列として扱われるため、id = "printable"を使用してテーブル全体をdivに配置します。

<div ng-app="myapp" ng-controller="layout"> 
<div id="printable"> 
<table > 
<tr> 
    <th>this one th</th> 
    <th>this is second th</th> 
    <th>third th</th> 
</tr> 
<tr> 
    <td>first td</td> 
    <td>second td</td> 
    <td>third td</td> 
    <td ng-class="{'class':('hides'=='hide')}">hidden in ng-class</td> 
    <td ng-hide="true">hidden td</td> 
</tr> 
<tr> 
    <td>first td</td> 
    <td>second td</td> 
    <td>third td</td> 
    <td ng-class="{'class':('hide'=='hide')}">hidden in ng-class</td> 
    <td ng-hide="true">hidden td</td> 
</tr> 
</table> 
</div> 
<button ng-click="printDiv('printable');">Print Div</button> 
</div> 

http://jsfiddle.net/U3pVM/31141/

この答えはあなたの問題を解決を願っています。 :)