We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Trusted by the world’s leading companies

syncfusion trusted companies

Overview

The Angular Word Processor is a feature rich UI component with editing capabilities like Microsoft Word. Also known as the document editor, it is used to create, edit, view, and print Word documents. It provides all the common Word processing features including editing text, formatting contents, resizing images and tables, finding and replacing text, bookmarks, tables of contents, printing, and importing and exporting Word documents.


Why choose Syncfusion Angular Word Processor?

Angular Word Processor high performance

High performance

The Angular Word Processor has been designed and optimized for high performance.

Angular Word Processor MS word editor

Microsoft-Word-like editor

The Word Processor is a feature-rich Word document editor component. With it, you can add a Microsoft-Word-like word processing solution in your web application.

Angular Word Processor restrict editing

Restrict editing

The Word Processor allows you to restrict editing. When a protected document has range permissions, only a unique user or user group is authorized to modify a separate text area.

Angular Word Processor comments

Add notes using comments

You can add comments to documents using Document Editor. In both code and the UI, you may add, navigate, and remove comments.

Angular Word Processor track and review

Track and review changes

The track changes feature keeps a record of changes and edits made to a document. You can then accept or reject the changes. It is a useful tool for managing modifications made by multiple reviewers in the same document.

Angular Word Processor responsiveness

Create and fill a form

The Word Processor has an intuitive UI for creating fillable forms in documents by inserting legacy form fields, just like Microsoft Word. Once the document is protected with the FormFieldsOnly restriction, users can fill the form.

Angular Word Processor themes

Attractive, customizable themes

Cutting-edge design with several built-in themes, such as Fluent, Tailwind CSS, Bootstrap, Material, and Fabric. Utilize the online Theme Studio tool to customize themes of word processor easily.

Angular Word Processor globalization

Globalization and localization

Enable users from different locales to use the component by formatting dates, currency, and numbering to suit preferences.


Angular Word Processor Code Example

Easily get started with the Angular Word Processor using a few simple lines of HTML and TS code example as demonstrated below. Also explore our Angular Word Processor Example that shows you how to configure the word processor in Angular.

<div class="control-section">
    <div>
        <div id="default_title_bar" class="e-de-ctn-title"></div>
        <div>
            <ejs-documenteditorcontainer #documenteditor_default [enableToolbar]=true [locale]="culture" (created)="onCreate()" (documentChange)="onDocumentChange()" height="600px" style="display:block;"></ejs-documenteditorcontainer>
        </div>
    </div>
</div>
import { Component, ViewEncapsulation, ViewChild } from '@angular/core';
import { ToolbarService, DocumentEditorContainerComponent } from '@syncfusion/ej2-angular-documenteditor';
import { TitleBar } from './title-bar';
import { defaultDocument, WEB_API_ACTION } from './data';
import { isNullOrUndefined } from '@syncfusion/ej2-base';

@Component({
    selector: 'control-content',
    templateUrl: 'default.html',
    encapsulation: ViewEncapsulation.None,
    providers: [ToolbarService]
})
export class DocEditorComponent {
    public hostUrl: string = 'https://ej2services.syncfusion.com/production/web-services/';
    @ViewChild('documenteditor_default')
    public container: DocumentEditorContainerComponent;
    public culture: string = 'en-US';
    titleBar: TitleBar;

    onCreate(): void {
        let titleBarElement: HTMLElement = document.getElementById('default_title_bar');
        this.titleBar = new TitleBar(titleBarElement, this.container.documentEditor, true);
        this.container.serviceUrl = this.hostUrl + WEB_API_ACTION;
        this.container.documentEditor.open(JSON.stringify(defaultDocument));
        this.container.documentEditor.documentName = 'Getting Started';
        this.titleBar.updateDocumentTitle();
    }

    onDocumentChange(): void {
        if (!isNullOrUndefined(this.titleBar)) {
            this.titleBar.updateDocumentTitle();
        }
        this.container.documentEditor.focusIn();
    }
}

Open, edit and save

The Angular Word Processor (Document Editor) provides a new native file format called Syncfusion Document Text (*.sfdt). It helps maintain document import and export purely on the client-side.

An illustration of Microsoft Word compatibility.

Microsoft Word Compatible

Provides a .NET library that helps convert Word documents (DOCX, WordML, DOC, RTF, TXT) to SFDT format at server side.

Import SFDT documents in Angular Word Processor

Importing

Import the SFDT format document content from a local file or string.

Export documents as DOCX, SFDT in Angular Word Processor

Exporting

Export the document content to SFDT and DOCX formats as a blob or downloadable file.


Collaborative editing

The Angular Word Processor allows multiple users to work on the same document simultaneously. This can be done in real-time, so that collaborators can see the changes as they are made. Collaborative editing can be a great way to improve efficiency, as it allows team members to work together on a document without having to wait for others to finish their changes.


Find and replace

The Angular Word Processor comes with a Microsoft Word-inspired navigation pane. It provides intuitive UI options to search text, navigate between the results, and replace it with other text.

Find and replace functionality in Angular Word Processor.


Printing

The Angular Word Processor allows users to print an entire document or a specific page directly from the browser.

Print document using Angular Word Processor


User-friendly interactions

Enjoy a smooth and user-friendly experience for mouse, touch, and keyboard interfaces.

Intuitive, touch-friendly selection in Angular Word Processor

Selection

Flexible selection options using mouse, touch, or Microsoft Word like keyboard shortcuts.

Interactive, touch-friendly scrolling in Angular Word Processor

Scrolling

Scroll multiple pages of a document rapidly.

Interactive, touch-friendly zooming in Angular Word Processor

Zooming

Interactively zoom in and zoom out the page contents. Users can easily change view to fit a page or page width.


Seamless editing

The Angular Word Processor provides seamless editing experience and offers intuitive and touch-friendly UI options like context menus, dialogs, and a navigation pane.

Cut, copy, and paste rich text in Angular Word Processor

Clipboard

Cut, copy, and paste of formatted content within the same document. Also paste plain text to and from other applications.

Undo and redo in Angular Word Processor

Undo and redo

Perform multiple levels of undo and redo operations.

Dialog in Angular Word Processor

Dialog

Insert document elements and apply advanced formatting options with ease.

Context menu in Angular Word Processor

Context menu

The context menu provides options to perform common editing actions. The list of actions is updated automatically based on the selection context.

Interactive image resizing in Angular Word Processor

Image resizing

Provides an awesome user experience to interactively resize an image using mouse or touch.

Interactive table resizing in Angular Word Processor

Table resizing

Adjust a row height or column width interactively.


Document elements

The Angular Word Processor includes all the commonly used document elements like text, images, tables, hyperlinks, bookmarks, table of contents, page fields, sections, headers, and footers.

Text in Angular Word Processor

Text

Create or edit documents with text in various languages.

Images in Angular Word Processor

Images

Easily browse for an image file or online image URL and insert text in line . Common raster image formats like PNG, BMP, JPEG, and GIF, are supported.

Table in Angular Word Processor

Table

Create simple or complex nested tables using built-in dialog. Also add or remove rows and columns, define header rows, merge, or resize cells depending on their contents.

Bookmarks in Angular Word Processor

Bookmarks

Mark a place in the document to find it again easily. Users can enter as many bookmarks as needed in the document and give each one a unique name to identify it.

Page fields in Angular Word Processor

Page fields

Add dynamic page numbers to a document that updates automatically.

Breaks in Angular Word Processor

Breaks

Use line break, page break, or section break to get the documents formatted better.

Hyperlink in Angular Word Processor

Link text for quick access to web page, file, email, bookmark, etc. Users can insert links using built-in dialog and Microsoft Word-inspired automatic conversion of text to link. Moreover, navigation can be customized to open the target from other applications.

Table of contents in Angular Word Processor

Table of contents

Outline the headings in a document and easily navigate to it, and shows page numbers too. Users can customize it using built-in dialog.

Headers in Angular Word Processor

Headers and footers

Easily add page numbers, dates, or author’s name at one place to be repeated at the top or bottom of each page. However, users can specify different headers or footers for the first page and odd and even pages of each section.


Formatting

The Angular Word Processor includes all the commonly used document formatting options.

Text formatting in Angular Word Processor

Text formatting

Format text using bold, italics, underline, font family, size, color, highlight, subscript, superscript, and more.

Paragraph formatting in Angular Word Processor

Paragraph formatting

Format paragraphs with indentation, alignment, and spacing.

Bullets in Angular Word Processor

Bullets and numbering

Organize items or create an outline of a document with bullets and numbering. Both single and multilevel lists can be added.

Styles in Angular Word Processor

Styles

Apply built-in styles to ensure consistency within a document. In addition, modify it or create custom styles. Both character and paragraph styles are supported.

Table formatting in Angular Word Processor

Table formatting

Format the table with indent, alignment, cell margins and spacing, borders, shadings, row height, break row across pages, and more.

Page settings in Angular Word Processor

Page settings

Design the structure and layout of document pages in each section by customizing size, margins, header distance, footer distance, etc.


Angular version compatibility

With continuous improvement in Angular versions, the Angular Word Processor is kept up to date to make it compatible with the latest version.

Angular version compatibility.





Other supported frameworks

Word Processor is also available in Blazor, React, Vue, and JavaScript frameworks. Check out the different Word Processor platforms from the links below,

Supported browsers

The Angular Word Processor works well with all modern web browsers such as Chrome, Firefox, Microsoft Edge, Safari, and Opera.

Supported browsers

80+ ANGULAR UI COMPONENTS

Frequently Asked Questions

  • Experience seamless and Microsoft Word like WYSIWYG editing capabilities.
  • Compatible with Microsoft Word file formats (DOC, DOCX) and other formats such as RTF and SFDT (Syncfusion Document Text) format files.
  • Offers highly intuitive user interfaces.
  • Designed and optimized for high performance in every aspect.
  • One of the best Angular Word Processor that offers feature-rich UI to interact with the software.
  • Simple configuration and API.
  • Supports all modern browsers.
  • Mobile-touch friendly and responsive.
  • Expansive learning resources such as demos and documentation to learn quickly and get started with Angular Word Processor.

You can find our Angular Word Processor demo, which demonstrates how to render and configure the Word Processor.

No, this is a commercial product and requires a paid license. However, a free community license is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue, 5 or fewer developers, and 10 or fewer total employees.

A good place to start would be our comprehensive getting started documentation.

Our Customers Love Us

Having an excellent set of tools and a great support team, Syncfusion reduces customers’ development time.
Here are some of their experiences.

Rated by users across the globe

Transform your applications today by downloading our free evaluation version Download Free Trial

Awards

Greatness—it’s one thing to say you have it, but it means more when others recognize it. Syncfusion is proud to hold the following industry awards.

Up arrow icon
Live Chat Icon For mobile