samwiseduzer / angularprint Goto Github PK

I'd like to hide the button that is on every cell of a column, but I don't know if I did well:

                <td>
                    <div print-remove>
                        <div class="btn btn-primary btn-xs" ng-click="printQuiz($index)">
                            <span class="glyphicon glyphicon-print"></span> Stampa
                        </div>
                    </div>
                </td>

The documentation states that printOnly will apply to the element and its children, however it appears to not apply to the children. It looks like another css rule needs to be added to make any children visible when printing

I try to print a table, but in the preview and in the print, the table are in the middle of the page. Have a big white space between table and the top of page.

print.pdf
When i am trying to print a content always an extra empty page is getting printed.

Also is the a provision to fix margins. Margins are very narrow.

You can see what i am trying to say here from the attached pdf.

Hi, I love your plugin. it really helpful.

But i got an issue. If the print-section inside nested div it become at center not at top of page. how can i reset all container on print?

Thanks

I'm using Angular Material, I've an sidenav alongside my container. This sidenav is collapsing on tablet and mobile devices. So this is wat happens on my desktop screensize:

And this is the result on my tablet/mobile screen size:

I'm using the print-remove directive on the sidenav but it isn't working.

Plunker link :https://plnkr.co/edit/l9dnC2KnChznUf8mk1As?p=preview

Fix:
invoke $window.print inside $timeout()

AngularPrint.directive('printBtn',['$window','$timeout', function($window,$timeout){
       return {
           restrict: 'A',
           link: function(scope, element){
               element.on('click', function(event){
                 
                   $timeout(function () {
                         $window.print();
   }, 0); 
               });
           }
       };
   }]);

Thanks for a nice library!

While the license if included in the Bower file, I think it would be nice if you included an MIT license in a file called LICENSE as well.

Cheers!

I try installing it by typing the command "bower install AngularPrint"
and its reply is "bower ENOTFOUND Package AngularPrint not found"

PrintIf directive doesn't remove blank spaces in case when condition false.

I wasn't sure if you'd get my comment since the issue appeared closed, so i opened this one. On Microsoft Edge, none of the features work. For example, the print-remove divs all appear on screen. On IE, the format doesn't hold on print preview and part of the document gets cut off. On Chrome, part of the side navbar is added along with a colored block. In addition, none of the format holds.

Firefox works beautifully! Any help would be greatly appreciated!

Each time I print, four pages with the same content are produced. This behaviour is consistent accross OS and Browsers.

my code:

<div print-section>
  <div class="modal-header">
    <h3 class="modal-title">
    	{{$ctrl.order.VariableSymbol}}
    </h3>
  </div>
  <div class="modal-body">
    SOME TEXT
  </div>
</div>
<div class="modal-footer">
  <button print-btn class="btn btn-primary" type="button">Print</button>
</div>

I did this

<button print-landscape>Print Landscape</button>

but not worked , then i did following to make it work,

<button print-landscape print-btn>Print Landscape</button>

I have added print-only to a static table that should be the only thing visible in the print preview, but what I get is the exact opposite: I see everything in the print preview EXCEPT the element with the print-only attribute and it's children.

This is in Chrome 45.0.2454.99 (64-bit)

Hi,

Just now I am trying this simple and awesome plugin in my Angular App. This works great however I noticed that even when I use the print-section to a small div inside the page, the print view takes the entire website's css into consideration. For example, lets say I have a website with sidebar of 200px like this:

<body>
   <div class="sidebar">
       Menus
   </div>
   <div class="mainbody>
     Main Body Contents are here.
     <div print-section>
        This is going to print!
     </div>
    </div>
</body>

In the above code, the print view shows only the print-section contents, however it has the 200px sidebar margin in it which has an ugly empty column in the left. Is that how its supposed to work? I did try adding a few overrides to print only media queries to my site css which seems to override the sidebar, etc.. in firefox but chrome is still showing the margins.

Also, is there a way for the print view to ignore divs that are wrapped outside the print section? This way, the site structure can be ignored and only the print section is printed wrapped inside its own body.Can you share your suggestion please?

The title explains it.

After I use 'print-table', my ng-click on the td does not work.

Does this only work in Google Chrome? I am not able to get the same results with Firefox or Safari.

I added print-section directive to the div. But when i click on print button. It is printing the entire page not the specific section.

Somehow that kind of combination creates print output in the middle of a page

Code to reproduce it:

        <div class="row" id="invoice" print-section>
            <div class="col-md-12" ng-bind-html="invoice"></div>
        </div>

where invoice part is a table which I want to print only and is set as

<table style="width: 700; height: 389px;" align="center" print-table="invoice">
....
</table>

but it looks like anything at the top is pulled and replaced with a white space.

I added the print-section directive to scrollable div, but when I click on the print-btn it's shows the scrollbar on the preview without getting all the page data to the preview.

What is supposed to happen on screen? I added the print-section to a div and added the print-btn directive to a button at the end of the div. I press the button and nothing happens.

Am I missing something? I included the angularPrint.css and angularPrint.js files, included 'AngularPrint' in my module. Is there something else that I have to do?

I have a print form including a table that does not print the table header after page breaks.
I have include the snippet I am using with my HTML page.

<div print-only>
    <div class="row"  print-section>
        <div class="text-center">
            <h2>{{survey.name}}</h2>
        </div>
    </div>

    <div class="form-group" print-section>
        <label>Supervisor</label>
        <input type="text" class="form-control" name="supervisor" id="supervisor">

        <label>Employee</label>
        <input type="text" class="form-control" name="employee" id="employee">

        <label>Employee ID</label>
        <input type="text" class="form-control" name="employeeId" id="employeeId">
    </div>

    <table class="table table-striped" print-table="surveyQuestions" print-only>
        <thead>
        <tr>
            <th translate="coursemillSurveyApp.surveyQuestion.sequence">Sequence</th>
            <th translate="coursemillSurveyApp.surveyQuestion.question">Question</th>
            <th translate="global.survey.true">True</th>
            <th translate="global.survey.false">False</th>
            <th></th>
        </tr>
        </thead>
        <tbody>
        <tr ng-repeat="surveyQuestion in surveyQuestions" print-avoid-break >
            <td>{{surveyQuestion.sequence}}</td>
            <td>{{surveyQuestion.question}}</td>
            <td>
                <div class="form-group">
                    <input type="checkbox" class="form-control">
                </div>
            </td>
            <td>
                <div class="form-group">
                    <input type="checkbox" class="form-control" name="noCourseId">
                </div>
            </td>
            <div>
            </div>
        </tr>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
        </tbody>
    </table>
</div>

i want to print using this code.

and print-btn in same html page.

but the data show up in second klik of the button. how can i fix it?
can i customize the print page size?

Can you create a new release (0.3.9) for the latest changes so bower can pick the newest version instead of the 0.3.8 version?

<button print-btn ng-click="getData()">Click</button>

when button pressed...yes will show print preview, but doFunction() will not run until print popup closed.
cause I need value from getData(), can we call print-btn from getData() ?

$ bower install angular-print --save
bower angular-print#* cached git://github.com/samwiseduzer/angularPrint.git#0.3.7
bower angular-print#* validate 0.3.7 against git://github.com/samwiseduzer/angularPrint.git#*
bower angularPrint#~0.3.7 ENOTFOUND Package angularPrint not found

Could you take a look into this issue?

The issue caused some downstream issues when we want to manage the version.

Thanks,

-Jinbo

I know its no longer actively maintained, but could we get this onto npm.
Also are there any forks that are maintained?

Thank you.

I had implemented this directive with good success, but now with Chrome 54 out, I have a bottom margin of about 50% of the page area that I can't get rid of. I was able to overcome an excessive right margin with a negative right margin value, but the bottom margin is still there and compresses my content towards the top. Anyone have any idea what changed with Chrome 54 to cause this? It still displays properly on Chrome 53 and earlier.

I am using print-if in my application and it simply does not work. I even tried doing print-if="false" to test if it had an issue getting the value, but even when I did that, it did not work.

The Angular Print works fine in Google Chrome, however when I print from Firefox, it only prints 1 page even when there more contents which should print in subsequent pages. The print also shows it has page 1 of 1 with the overflowing contents cut off.