Creating your First Angular Application
This tutorial shows how to create your first Angular application using TX Text Control DocumentViewer for Angular.
Install Node.js® and npm, if not done before.
Open a Command Prompt and install the Angular CLI globally by typing in the following command:npm install -g @angular/cli
This tutorial uses Visual Studio Code that can be downloaded for free.
Creating the Angular Project
Open a Command Prompt and create a new project and default app by typing in the following command:
ng new my-viewer-app
Follow the questions in the command prompt by answering them with "y" to add Angular routing and Enter to confirm CSS as your preferred stylesheet format.
Change into the created folder by typing in the following command:cd my-viewer-app
Install the TX Text Control document editor package by typing in the following command:ng add @txtextcontrol/tx-ng-document-viewer
Open this folder in Visual Studio Code by typing in the following command:code .
In Visual Studio Code, open the file src -> app -> app.component.html, add the following code and save it:
Back in the command prompt, start the Angular application by typing in the following command:ng serve --open
Your default browser is opened with your created Angular app:
This tutorial uses a demo server backend for the required endpoints that is specified through the basePath attribute.
Creating Your Own Backend Server
To learn how to create your own Backend server project, please have a look at this tutorial:
You don't have to actually add a view to this backend server. All you need to do is to add the NuGet package to your .NET Core-based backend server. Make sure to use the Prerelease version 126.96.36.1990-beta or better.
All available attributes for the Angular element are documented in the NPM package overview page:
TXDocumentViewer ╰ TX Text Control .NET Server for ASP.NET
╰ TXDocumentViewer Object