diff --git a/Document-Processing/Word/Word-Processor/angular/feature-module.md b/Document-Processing/Word/Word-Processor/angular/feature-module.md index b07e362ba8..38410e2e89 100644 --- a/Document-Processing/Word/Word-Processor/angular/feature-module.md +++ b/Document-Processing/Word/Word-Processor/angular/feature-module.md @@ -1,30 +1,30 @@ --- layout: post -title: Feature module in Angular Document editor component | Syncfusion -description: Learn here all about Feature module in Syncfusion Angular Document editor component of Syncfusion Essential JS 2 and more. +title: Feature module in Angular DOCX Editor component | Syncfusion +description: Learn here all about Feature module in Syncfusion Angular Document Editor component of Syncfusion Essential JS 2 and more. platform: document-processing control: Feature module documentation: ug domainurl: ##DomainURL## --- -# Feature module in Angular Document editor component +# Feature module in Angular Document Editor component -[Angular DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/angular-docx-editor) (Document Editor) features are segregated into individual feature-wise modules to enable selective referencing. By default, the document editor displays the document in read-only mode. The required modules should be injected to extend its functionality. The following are the selective modules of document editor that can be included as required: +[Angular DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/angular-docx-editor) (Document Editor) features are segregated into individual feature-wise modules to enable selective referencing. By default, the Document Editor displays the document in read-only mode. The required modules should be injected to extend its functionality. The following are the selective modules of Document Editor that can be included as required: * **PrintService** - Prints the document. * **SfdtExportService** - Exports the document as Syncfusion® Document Text (.SFDT) file. -* **SelectionService** - Selects a portion of the document and copy it to the clipboard. -* **SearchService** - Searches specific text and navigate between the results. +* **SelectionService** - Selects a portion of the document and copies it to the clipboard. +* **SearchService** - Searches specific text and navigates between the results. * **WordExportService** - Exports the document as Word Document (.DOCX) file. * **TextExportService** - Exports the document as Text Document (.TXT) file. -* **EditorService** - Performs all kind of editing operations. +* **EditorService** - Performs all kinds of editing operations. * **EditorHistoryService** - Maintains the history of editing operations so that you can perform undo and redo at any time. * User interface options such as context menu, options pane, image resizer, and dialog are available as individual modules. ->In addition to injecting the required modules in your application, enable corresponding properties to extend the functionality for a document editor instance. +>In addition to injecting the required modules in your application, enable corresponding properties to extend the functionality for a Document Editor instance. Refer to the following table. -| Module | Dependent modules to be injected for extending the functionality of document editor in your application | Property to enable the functionality for a document editor instance | +| Module | Dependent modules to be injected for extending the functionality of Document Editor in your application | Property to enable the functionality for a Document Editor instance | |---|---|---| |PrintService|`PrintService`|``| |SfdtExportService|`SfdtExportService`|``| @@ -42,7 +42,7 @@ Refer to the following table. |TableDialogService|`SelectionService, EditorService, TableDialogService`|``| |FontDialogService|`SelectionService, EditorService, FontDialogService`|``| |ParagraphDialogService|`SelectionService, EditorService, ParagraphDialogService`|``| -|BookmarkDialogService|`SelectionService, EditorService, BookmarkDialogService`|``| +|BookmarkDialogService|`SelectionService, EditorService, BookmarkDialogService`|``| |PageSetupDialogService|`SelectionService, EditorService, PageSetupDialogService`|``| |TableOfContentsDialogService|`SelectionService, EditorService, TableOfContentsDialogService`|``| |ListDialog|`SelectionService, EditorService, ListDialog`|``| @@ -54,4 +54,4 @@ Refer to the following table. |StyleDialogService|`SelectionService, EditorService, StyleDialogService`|``| |BulletsAndNumberingDialogService|`SelectionService, EditorService, BulletsAndNumberingDialogService`|``| -These modules should be injected into the `providers` section of root `NgModule` or component class. \ No newline at end of file +These modules should be injected into the `providers` section of the root `NgModule` or component class. \ No newline at end of file diff --git a/Document-Processing/Word/Word-Processor/angular/print.md b/Document-Processing/Word/Word-Processor/angular/print.md index db7ad96b52..86c51d28b6 100644 --- a/Document-Processing/Word/Word-Processor/angular/print.md +++ b/Document-Processing/Word/Word-Processor/angular/print.md @@ -1,18 +1,18 @@ --- layout: post -title: Print in Angular Document editor component | Syncfusion -description: Learn here all about Print in Syncfusion Angular Document editor component of Syncfusion Essential JS 2 and more. +title: Print in Angular DOCX Editor component | Syncfusion +description: Learn here all about Print in Syncfusion Angular Document Editor component of Syncfusion Essential JS 2 and more. platform: document-processing control: Print documentation: ug domainurl: ##DomainURL## --- -# Print in Angular Document editor component +# Print in Angular Document Editor component -To print the document, use the [`print`](https://ej2.syncfusion.com/angular/documentation/api/document-editor#print) method from document editor instance. +To print the document, use the [`print`](https://ej2.syncfusion.com/angular/documentation/api/document-editor#print) method from the Document Editor instance. -Refer to the following example for showing a document and print it. +Refer to the following example for showing a document and printing it. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -26,7 +26,7 @@ Refer to the following example for showing a document and print it. {% previewsample "/document-processing/samples/document-editor/angular/link-cs5" %} -Refer to the following example for creating a document and print it. +Refer to the following example for creating a document and printing it. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -42,9 +42,9 @@ Refer to the following example for creating a document and print it. ## Improve print quality -Document editor provides an option to improve the print quality using [`printDevicePixelRatio`](https://ej2.syncfusion.com/angular/documentation/api/document-editor/documentEditorSettingsModel#printdevicepixelratio) in Document editor settings. Document editor using canvas approach to render content. Then, canvas are converted to image and it process for print. Using printDevicePixelRatio API, you can increase the image quality based on your requirement. +The Document Editor provides an option to improve the print quality using [`printDevicePixelRatio`](https://ej2.syncfusion.com/angular/documentation/api/document-editor/documentEditorSettingsModel#printdevicepixelratio) in Document Editor settings. The Document Editor uses a canvas approach to render content. The canvas is then converted to an image and processed for print. Using the `printDevicePixelRatio` API, you can increase the image quality based on your requirement. -The following example code illustrates how to improve the print quality in Document editor container. +The following example code illustrates how to improve the print quality in the Document Editor container. ```typescript import { Component, OnInit } from '@angular/core'; @@ -65,11 +65,11 @@ export class AppComponent implements OnInit { > The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property. ->Note: By default, printDevicePixelRatio value is 1. +N> By default, the `printDevicePixelRatio` value is 1. ## Print using window object -You can print the document in document editor by passing the window instance. This is useful to implement print in third party frameworks such as electron, where the window instance will not be available. Refer to the following example. +You can print the document in the Document Editor by passing the window instance. This is useful to implement print in third-party frameworks such as Electron, where the window instance will be available. Refer to the following example. ```typescript import { NgModule } from '@angular/core'; @@ -142,13 +142,13 @@ Some of the print options cannot be configured using JavaScript. Refer to the fo * [`Chrome`](https://support.google.com/chrome/answer/1069693?hl=en&visit_id=1-636335333734668335-3165046395&rd=1/) * [`Firefox`](https://support.mozilla.org/en-US/kb/how-print-web-pages-firefox/) -However, you can customize margins, paper, and layout options by modifying the section format properties using page setup dialog +However, you can customize margins, paper, and layout options by modifying the section format properties using the page setup dialog. ```typescript this.documentEditor.showPageSetupDialog(); ``` -By customizing margins, papers, and layouts, the layout of the document will be changed in document editor. To modify these options during print operation, serialize the document as SFDT using the [`serialize`](https://ej2.syncfusion.com/angular/documentation/api/document-editor#serialize) method in document editor instance and open the SFDT data in another instance of document editor in separate window. +By customizing margins, papers, and layouts, the layout of the document will be changed in the Document Editor. To modify these options during the print operation, serialize the document as SFDT using the [`serialize`](https://ej2.syncfusion.com/angular/documentation/api/document-editor#serialize) method in the Document Editor instance and open the SFDT data in another instance of the Document Editor in a separate window. The following example shows how to customize layout options only for printing. @@ -164,6 +164,6 @@ The following example shows how to customize layout options only for printing. {% previewsample "/document-processing/samples/document-editor/angular/link-cs7" %} -## Online Demo +## Online demo Explore how to print Word documents using the Angular Document Editor in this live demo [here](https://document.syncfusion.com/demos/docx-editor/angular/#/tailwind3/document-editor/print). \ No newline at end of file diff --git a/Document-Processing/Word/Word-Processor/angular/restrict-editing.md b/Document-Processing/Word/Word-Processor/angular/restrict-editing.md index 18ae818a9d..c13e12b66e 100644 --- a/Document-Processing/Word/Word-Processor/angular/restrict-editing.md +++ b/Document-Processing/Word/Word-Processor/angular/restrict-editing.md @@ -1,24 +1,24 @@ --- layout: post title: Restrict Editing in Angular DOCX Editor | Syncfusion -description: Learn how to enable Restrict Editing in the Angular DOCX Editor to securely manage document access and control user modifications. +description: Learn how to enable Restrict Editing in the Angular Document Editor to securely manage document access and control user modifications. platform: document-processing control: Restrict editing documentation: ug domainurl: ##DomainURL## --- -# Restrict Editing in Angular DOCX Editor +# Restrict Editing in Angular Document Editor [Angular DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/angular-docx-editor) (Document Editor) provides support for restricting editing within a document. It enables control over how and where content can be modified. This helps limit editing so only specific sections of the document can be changed. ## Configure on client side -Document Editor provides options to protect and unprotect a document using the [enforceProtection](https://ej2.syncfusion.com/angular/documentation/api/document-editor/editor#enforceprotection) and [stopProtection](https://ej2.syncfusion.com/angular/documentation/api/document-editor/editor#stopprotection) APIs, enabling various restricting editing operations. +The Document Editor provides options to protect and unprotect a document using the [enforceProtection](https://ej2.syncfusion.com/angular/documentation/api/document-editor/editor#enforceprotection) and [stopProtection](https://ej2.syncfusion.com/angular/documentation/api/document-editor/editor#stopprotection) APIs, enabling various restrict-editing operations. ### Read only mode -Document Editor supports protecting a document in read-only mode, where users can only view the content without making changes. +The Document Editor supports protecting a document in read-only mode, where users can only view the content without making changes. The following example code illustrates how to enforce or remove read-only protection in the Document Editor. @@ -68,7 +68,7 @@ export class AppComponent { ### Form filling mode -Document Editor supports protecting a document with form-filling restrictions, allowing users to edit only form fields. +The Document Editor supports protecting a document with form-filling restrictions, allowing users to edit only form fields. The following example code illustrates how to enforce or remove form-filling restrictions in the Document Editor. @@ -118,7 +118,7 @@ export class AppComponent { ### Comments only mode -Document Editor supports protecting a document in comments-only mode, allowing users to add or edit comments only. +The Document Editor supports protecting a document in comments-only mode, allowing users to add or edit comments only. The following example code illustrates how to enforce and remove comments-only protection in the Document Editor. @@ -168,7 +168,7 @@ export class AppComponent { ### Track changes only mode -Document Editor supports protecting a document in revisions-only mode, allowing users to view the document and make corrections while tracking all changes. Users cannot accept or reject tracked changes; only the author can review and finalize them later. +The Document Editor supports protecting a document in revisions-only mode, allowing users to view the document and make corrections while tracking all changes. Users cannot accept or reject tracked changes; only the author can review and finalize them later. The following example code illustrates how to enforce and remove revisions-only protection in the Document Editor. @@ -218,7 +218,7 @@ export class AppComponent { ### Format restrictions -Enforces document protection using the specified credentials. In the [enforceProtection](https://ej2.syncfusion.com/angular/documentation/api/document-editor/editor#enforceprotection-1) method, the second parameter represents limitToFormatting, and the third parameter represents isReadOnly. +The Document Editor enforces document protection using the specified credentials. In the [enforceProtection](https://ej2.syncfusion.com/angular/documentation/api/document-editor/editor#enforceprotection-1) method, the second parameter represents `limitToFormatting`, and the third parameter represents `isReadOnly`. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -237,16 +237,14 @@ The Document Editor client requires a server-side API to generate a hash from th For more information on configuring restrict editing on the server side, refer to the following: - [Web Service for Restrict editing in ASP.NET Core](https://help.syncfusion.com/document-processing/word/word-processor/angular/web-services/core#restrict-editing) - - [Web Service for Restrict editing in ASP.NET MVC](https://help.syncfusion.com/document-processing/word/word-processor/angular/web-services/mvc#restrict-editing) - - [Web Service for Restrict editing in Java](https://help.syncfusion.com/document-processing/word/word-processor/angular/web-services/java#restrict-editing) ## Set current user The [currentUser](https://ej2.syncfusion.com/angular/documentation/api/document-editor-container/documenteditor#currentuser) property can be used to authorize the current document user by name, email, or user group. -The following code example demonstrates how to set the currentUser. +The following code example demonstrates how to set the `currentUser`. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -257,10 +255,12 @@ this.container.documentEditor.currentUser = 'engineer@mycompany.com'; {% endtabs %} ## Protect document with editable region -User can select a specific section and mark it as an editable region, allowing modification only in that part. The rest of the document remains protected from any changes. + +Users can select a specific section and mark it as an editable region, allowing modification only in that part. The rest of the document remains protected from any changes. ### Insert editable region -Use the [insertEditingRegion](https://ej2.syncfusion.com/angular/documentation/api/document-editor/editor#inserteditingregion) method to mark specific paragraphs as editable.This allows you to control editing by giving access to all users or only selected users. + +Use the [insertEditingRegion](https://ej2.syncfusion.com/angular/documentation/api/document-editor/editor#inserteditingregion) method to mark specific paragraphs as editable. This allows you to control editing by giving access to all users or only selected users. The following example shows how to insert an editable region. {% tabs %} @@ -310,7 +310,7 @@ Restrict Editing Pane provides the following options to manage the document: * To apply editing restrictions to the current document, select the read only check box. * To add users to the current document, select more users option and add user from the popup dialog. * To include range permission to the current document, select parts of the document and choose users who are allowed to freely edit them from the listed check box. -* To apply the chosen editing restrictions, click the **YES,START ENFORCING PROTECTION** button. A dialog box displays asking for a password to protect. +* To apply the chosen editing restrictions, click the **YES, START ENFORCING PROTECTION** button. A dialog box displays asking for a password to protect. * To stop protection, select **STOP PROTECTION** button. A dialog box displays asking for a password to stop protection. The following code shows Restrict Editing Pane. To unprotect the document, use password '123'. @@ -324,7 +324,7 @@ The following code shows Restrict Editing Pane. To unprotect the document, use p {% include code-snippet/document-editor/angular/document-editor-container-cs1/src/main.ts %} {% endhighlight %} {% endtabs %} - + {% previewsample "/document-processing/samples/document-editor/angular/document-editor-container-cs1" %} -N> The hosted Web API URL is for demo and evaluation purposes only. For production, host your own web service using the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server). +N> The hosted Web API URL is for demo and evaluation purposes only. For production, host your own web service using the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or the [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server). diff --git a/Document-Processing/Word/Word-Processor/angular/ribbon.md b/Document-Processing/Word/Word-Processor/angular/ribbon.md index 63f4cf471a..13712d58d8 100644 --- a/Document-Processing/Word/Word-Processor/angular/ribbon.md +++ b/Document-Processing/Word/Word-Processor/angular/ribbon.md @@ -1,7 +1,7 @@ --- layout: post -title: Ribbon in Angular Document editor control | Syncfusion -description: Learn here all about the Ribbon UI in Syncfusion Angular Document editor control, how to switch between Ribbon and Toolbar modes. +title: Ribbon in Angular DOCX Editor control | Syncfusion +description: Learn here all about the Ribbon UI in Syncfusion Angular Document Editor control, how to switch between Ribbon and Toolbar modes. platform: document-processing control: Ribbon documentation: ug @@ -14,16 +14,16 @@ The [Angular DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/angular-doc You can switch between the classic **Toolbar** and the new **Ribbon** UI, and you can also choose between **Classic** and **Simplified** ribbon layouts. -## Enable Ribbon Mode +## Enable ribbon mode -To enable Ribbon in Angular Document Editor, use the [`toolbarMode`](https://ej2.syncfusion.com/angular/documentation/api/document-editor-container/index-default#toolbarmode) property of `DocumentEditorContainer`. The available toolbar modes are: +To enable Ribbon in Angular Document Editor, use the [`toolbarMode`](https://ej2.syncfusion.com/angular/documentation/api/document-editor-container#toolbarmode) property of `DocumentEditorContainer`. The available toolbar modes are: - **'Toolbar'** - The traditional toolbar UI. - **'Ribbon'** - The Ribbon UI, which provides a tabbed interface with grouped commands. By default, `toolbarMode` is `Toolbar`. -To use Ribbon mode in the Document Editor, include the necessary CSS files from the **../node_modules/@syncfusion** package folder. This can be referenced in [src/styles.css] using following code. +To use Ribbon mode, add the Document Editor component and its dependent component styles available in the **../node_modules/@syncfusion** package folder. This can be referenced in [src/styles.css] using the following code. ```css @import '../node_modules/@syncfusion/ej2-base/styles/material.css'; @@ -38,7 +38,7 @@ To use Ribbon mode in the Document Editor, include the necessary CSS files from @import '../node_modules/@syncfusion/ej2-ribbon/styles/material.css';/* Required for Ribbon */ ``` -The following code shows the how to enable the `Ribbon` in Document Editor. +The following code shows how to enable the `Ribbon` in the Document Editor. ```typescript /** @@ -70,7 +70,7 @@ export class AppComponent { } ``` -## Ribbon Layouts +## Ribbon layouts Document Editor provides two different Ribbon layouts: @@ -79,7 +79,7 @@ Document Editor provides two different Ribbon layouts: By default, `ribbonLayout` is set to `Simplified`. -The following code shows the how to configure the ribbon layout in Document Editor: +The following code shows how to configure the ribbon layout in the Document Editor: ```typescript /** @@ -112,6 +112,6 @@ export class AppComponent { } ``` -## See Also +## See also * [How to customize the ribbon](./how-to/customize-ribbon) diff --git a/Document-Processing/Word/Word-Processor/angular/right-to-left.md b/Document-Processing/Word/Word-Processor/angular/right-to-left.md index 4649fdc411..3dcc1833a1 100644 --- a/Document-Processing/Word/Word-Processor/angular/right-to-left.md +++ b/Document-Processing/Word/Word-Processor/angular/right-to-left.md @@ -1,16 +1,16 @@ --- layout: post -title: Right to left in Angular Document editor component | Syncfusion -description: Learn here all about Right to left in Syncfusion Angular Document editor component of Syncfusion Essential JS 2 and more. +title: Right to left in Angular DOCX Editor component | Syncfusion +description: Learn here all about Right to left in Syncfusion Angular Document Editor component of Syncfusion Essential JS 2 and more. platform: document-processing control: Right to left documentation: ug domainurl: ##DomainURL## --- -# Right to left in Angular Document editor component +# Right to left in Angular Document Editor component -[Angular DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/angular-docx-editor) (Document Editor) provides RTL (right-to-left) support. This can be enabled using the “enableRtl” property. +[Angular DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/angular-docx-editor) (Document Editor) provides RTL (right-to-left) support. This can be enabled using the `enableRtl` property. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -24,6 +24,6 @@ domainurl: ##DomainURL## {% previewsample "/document-processing/samples/document-editor/angular/rtl-cs1" %} -## Online Demo +## Online demo -Explore how to enable right-to-left layout in Word documents using the Angular Document Editor in this live demo [here](https://document.syncfusion.com/demos/docx-editor/angular/#/tailwind3/document-editor/right-to-left). \ No newline at end of file +Explore how to enable right-to-left layout in Word documents using the Angular Document Editor in this [live demo](https://document.syncfusion.com/demos/docx-editor/angular/#/tailwind3/document-editor/right-to-left). \ No newline at end of file