If you require to visually perceive an example of angular 11/10 ng2-pdf-viewer example. i would relish apportioning with your angular 11/10 pdf viewer example. Here you will learn angular 11/10 pdf viewer and editor. it's a simple example of angular 11/10 ng2-pdf-viewer print.
In this example, we will utilize ng2-pdf-viewer npm package to pdf file viewer in angular 11 application. we will simply install that ng2-pdf-viewer npm package and use the PdfViewerModule module to engender code.
You can easily create your angular app using bellow command:
ng new myNewApp
Now in this step, we need to just install ng2-pdf-viewer
in our angular application. so let's add as like bellow:
npm install ng2-pdf-viewer --save
we will import PdfViewerModule module as like bellow code:
src/app/app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { PdfViewerModule } from 'ng2-pdf-viewer';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
PdfViewerModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
here, we need to update ts file as like bellow:
src/app/app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
pdfFilePath = "https://vadimdez.github.io/ng2-pdf-viewer/assets/pdf-test.pdf";
}
here, we need to update html file as like bellow code:
src/app/app.component.html
<h1>Angular PDF File Viewer Example - HackTheStuff</h1>
<pdf-viewer [src]="pdfFilePath"
[render-text]="true"
style="display: block;"
></pdf-viewer>
i hope it will be help you.
Hi, My name is Harsukh Makwana. i have been work with many programming language like php, python, javascript, node, react, anguler, etc.. since last 5 year. if you have any issue or want me hire then contact me on [email protected]
How to create jQuery slide left and right toggle effect
Use the jQuery animate() metho...Laravel 8 Upload File in Google Drive
Laravel PHP Engender Folder and Upload f...timedropper jQuery UI timepicker example
Sometimes, you may need to add time inpu...Remove a Package from Laravel using Composer
Composer is dependency manager for PHP p...Laravel 8 File Upload and Download Tutorial Example
File upload and download is most common...