diff --git a/Environment Integration/Universal SSR/SSR/.editorconfig b/Environment Integration/Universal SSR/.editorconfig similarity index 100% rename from Environment Integration/Universal SSR/SSR/.editorconfig rename to Environment Integration/Universal SSR/.editorconfig diff --git a/Environment Integration/Universal SSR/SSR/.gitignore b/Environment Integration/Universal SSR/.gitignore similarity index 100% rename from Environment Integration/Universal SSR/SSR/.gitignore rename to Environment Integration/Universal SSR/.gitignore diff --git a/Environment Integration/Universal SSR/SSR/.prettierrc b/Environment Integration/Universal SSR/.prettierrc similarity index 100% rename from Environment Integration/Universal SSR/SSR/.prettierrc rename to Environment Integration/Universal SSR/.prettierrc diff --git a/Environment Integration/Universal SSR/SSR/README.md b/Environment Integration/Universal SSR/README.md similarity index 98% rename from Environment Integration/Universal SSR/SSR/README.md rename to Environment Integration/Universal SSR/README.md index 3762a2f..2100cfd 100644 --- a/Environment Integration/Universal SSR/SSR/README.md +++ b/Environment Integration/Universal SSR/README.md @@ -1,4 +1,4 @@ -# SSR +# AngularSsrPdfviewer This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 21.2.7. diff --git a/Environment Integration/Universal SSR/SSR/DEPLOYMENT_INTEGRATION_UG.md b/Environment Integration/Universal SSR/SSR/DEPLOYMENT_INTEGRATION_UG.md deleted file mode 100644 index db2eaca..0000000 --- a/Environment Integration/Universal SSR/SSR/DEPLOYMENT_INTEGRATION_UG.md +++ /dev/null @@ -1,268 +0,0 @@ ---- -layout: post -title: Getting started with Syncfusion Angular PDF Viewer in Angular Universal SSR -description: A quick guide to integrate Syncfusion Angular PDF Viewer with Angular Universal Server-Side Rendering. -control: PDF Viewer -platform: document-processing -documentation: ug ---- - -# Getting started with Syncfusion Angular PDF Viewer in Angular Universal (SSR) - -This guide shows how to create an Angular Universal SSR application and integrate the Syncfusion Angular PDF Viewer component. - -## Prerequisites - -- **Node.js:** v20 or later -- **Angular CLI:** v21 or later -- **npm:** v10 or later - ---- - -## Step 1: Create Angular SSR Project - -Create a new Angular application with Server-Side Rendering: - -```bash -ng new my-ssr-app --ssr -cd my-ssr-app -``` - -During setup, choose: -- **Add routing?** Yes/No (based on your needs) -- **Stylesheet format?** CSS (or SCSS/SASS/LESS) - ---- - -## Step 2: Install Syncfusion PDF Viewer - -Install the Syncfusion Angular PDF Viewer package: - -```bash -npm install @syncfusion/ej2-angular-pdfviewer --save -``` - ---- - -## Step 3: Add Syncfusion CSS Imports - -Update `src/styles.css` with Syncfusion theme imports: - -```css -@import '../node_modules/@syncfusion/ej2-base/styles/material.css'; -@import '../node_modules/@syncfusion/ej2-buttons/styles/material.css'; -@import '../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; -@import '../node_modules/@syncfusion/ej2-inputs/styles/material.css'; -@import '../node_modules/@syncfusion/ej2-navigations/styles/material.css'; -@import '../node_modules/@syncfusion/ej2-popups/styles/material.css'; -@import '../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; -@import '../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css'; -@import '../node_modules/@syncfusion/ej2-notifications/styles/material.css'; -``` - ---- - -## Step 4: Create PDF Viewer Component - -Generate a new component: - -```bash -ng generate component pdf-viewer --standalone -``` - -{% tabs %} -{% highlight ts tabtitle="Standalone" %} -import { Component, PLATFORM_ID, Inject, OnInit, NO_ERRORS_SCHEMA } from '@angular/core'; -import { isPlatformBrowser, CommonModule } from '@angular/common'; -import { - PdfViewerModule, - LinkAnnotationService, - BookmarkViewService, - MagnificationService, - ThumbnailViewService, - ToolbarService, - NavigationService, - TextSearchService, - TextSelectionService, - PrintService, - FormDesignerService, - FormFieldsService, - AnnotationService, - PageOrganizerService -} from '@syncfusion/ej2-angular-pdfviewer'; - -@Component({ - selector: 'app-pdf-viewer', - standalone: true, - imports: [CommonModule, PdfViewerModule], - schemas: [NO_ERRORS_SCHEMA], - template: ` -
PDF Viewer loads on client-side
-PDF Viewer loads on client-side (SSR compatible)
-Congratulations! Your app is running. 🎉
+Samplesiubsdf