2016-08-30 4 views
1

buttonを使用してdivの内容を印刷する必要があります。私はそれを検索し、AngularJSでそれを行う方法を見つけました。AngularJSで新しいウィンドウを開くことなくdivを印刷します

私の問題は、printが呼び出されるたびに新しいウィンドウが開きます。それを開くべきではありません。

新しいウィンドウのオープンをブロックする方法はありますか?以下

コード:

JS:

$scope.printControl = function(id) { 
    var printContents = document.getElementById(id).innerHTML; 
    var popupWin = $window.open('', '_blank', 'width=800,height=800'); 
    popupWin.document.open(); 
    popupWin.document.write('<html><body onload="window.print()">' + printContents + '</body></html>'); 
    popupWin.document.close(); 
};  

HTML:

<div id="printDiv"> 
    This div needs to be printed 
    </div> 
    <button ng-click="printControl('printDiv')"> 
    Print 
</button> 

Demo

+0

実際にあなたのJSで新しいウィンドウ($ window.open( ''、 '_blank' ...)を開くように定義しています)。 "_blank"を "_self"に置き換えることができます。しかし、私は安全上の理由から、ユーザーが印刷自体を最後に制御しなければならないので、このプロンプトを実際に嫌にすることはできないと信じています。 – Martin

+0

@Martinはこれをやって、私は見ることができます – Shashank

答えて

1

私は単純にするだろう:

$scope.printControl = function(id) { 
    $scope.visible = true; 
    $timeout(function(){ 
     $window.print();   
     $timeout(function(){ 
      $scope.visible = false; 
     }, 0); 
    }, 0); 
}; 

とあなたのボタンをこのように変更します。

<button ng-click="printControl('printDiv')" ng-hide="visible"> 

アイデアは、あなたが印刷する]ボタンをクリックしたときに、あなたのDOMに印刷したくない要素を隠すことである、と再ショーそれらの直後。

更新されたfiddleへのリンク。

+0

'html'全体が印刷されていますが、' div'のみが印刷されるはずです – Shashank

+0

私はそれを開くことなくそれを行う唯一の方法です新しいウィンドウistance、別の解決策でも願ってみましょう。 – Luxor001

関連する問題