ng2-pdfjs-viewer

To install and configure, check the npm package here: ng2-pdfjs-viewer

Github source: ng2-pdfjs-viewer
Access source of this entire demo here: ng2-pdfjs-viewer Demo

Open in external window with print preview

html


<!-- your.component.html -->
<button (click)="openPdf()" style="background-color: greenyellow; font-weight: bold; font-style: italic; height: 50px;">Open PDF in new tab and start print preview</button>
<ng2-pdfjs-viewer #externalPdfViewer [externalWindow]="true" [startPrint]=true></ng2-pdfjs-viewer>

typescript


<!-- your.component.ts -->
@ViewChild('externalPdfViewer') public externalPdfViewer;
public openPdf() {
    console.log("opening pdf in new tab!");
    this.externalPdfViewer.pdfSrc = "gre_research_validity_data.pdf";
    this.externalPdfViewer.refresh();
}
Note: All physical pdf files such as 'gre_research_validity_data.pdf' and 'pdf-sample.pdf' should be in application's 'assets' folder or public folder.

This demo is built using @MarkPieszak's aspnetcore-angular-universal repo(aspnetcore-angular-universal). It is one of the best new project templates I found for aspnetcore+angular projects.