THIS REPO IS NOT ACTIVELY MAINTAINED and has several incompatibilities with most browsers. I'm happy to test/review/merge pull requests and am open to passing ownership of this project to another.
AngularPrint
An Angular module that allows users to selectively print elements, as well as provides optimizations for printing. By default, printing margins are minimized.
Installation
- Make sure bower is installed;
- Navigate to the root directory of your project and execute the comand:
$ bower install angular-print
- Insert stylesheet and javascript file:
<!-- CSS --> <!-- JS -->
- Import module to your Angular app using the name "AngularPrint":
{ 'use strict'; angular;};
Using AngularPrint
printSection
- Directive type: Attribute
- Description: Makes element and its children visible for printing
I'll print Me, too! I won't
printOnly
- Directive type: Attribute
- Description: Makes element and its children only visible for printing
I'll print, but until then nobody wants me Me, too! Me, too! Except that people still want to look at me in the meantime...
printHide
- Directive type: Attribute
- Description: Makes element invisible during printing, but it is replaced by blank space
I won't print Me, either I'll print, but those bozos upstairs are still taking up space
printRemove
- Directive type: Attribute
- Description: Makes element invisible during printing
I won't print Me, either I'll print, and those bozos upstairs will finally stop making such a ruckus
printIf
- Directive type: Attribute
- Description: Toggles print-visibility based on expression
<!--Pigs do not yet fly, so this div, despite having print-section, will not print--><!--Sam IS the best, so this div will print, despite not having print-section-->
printBtn
- Directive type: Attribute
- Description: Adds onClick callback to element that will trigger printing
Doesn't matter where you put meI will make anything cause a printto happen if you click me
printLandscape
- Directive type: Attribute
- Description: Will cause printing to be landscape instead of portrait
Doesn't matter where you put meI will cause any printto be landscape
printAvoidBreak
- Directive type: Attribute
- Description: Prevents page breaks on element
This element won't get split by page breaks
printTable
- Directive type: Attribute
- Description:
- Optimizes table for printing. This includes keeping 'td' cell content from being cut-off by page breaks.
- Must be passed an array scope object representing the data presented by the table.
- Column headers will persist between pages only if the
<thead>
and<tbody>
tags are used correctly.
This example shows adjustments to an already-visible table in order to tailor it for printing
Unwanted field Name Address Phone {{person.unwantedInfo}} {{person.name}} {{person.address}} {{person.phone}}
This example shows a table made to only be visible during printing
Name Address Phone {{person.name}} {{person.address}} {{person.phone}}