We recently published the Technology Preview version of our Node.js and Angular implementations that enables developers to use the TX Text Control HTML5-based document editor in pure Angular and Node.js applications.

This tutorial shows how to use the JavaScript API to load and save documents within an Angular application.

  1. Create a basic Angular application as described in this tutorial:
    Creating your First Angular Application

  2. Create a folder named js in the folder src/assets/ and create a new JavaScript file named custom.js.

    Loading...
  3. And add this JavaScript file to the scripts array of the projects architect/build/options element in the angular.json file:

    Loading...
  4. Add the declaration and the methods onClickSave and onClickLoad to the app.component.ts TypeScript file, so that the complete file looks like this:

    Loading...
  5. Finally, add two buttons to the app.component.html with the Angular click handlers:

    Loading...

When executing the application, an HTML document is loaded into the editor and the save button alerts the resulting HTML from the saveDocument method.

Loading and saving documents in Angular