How to Change the Annotation Author Name in Angular PDF Viewer

14 Aug 20264 minutes to read

The annotationSettings API provides a central way to configure properties that apply to all annotations in the viewer.

API name: annotationSettings

Property Name Data type and Default Value Description
author String (“Guest”) Specifies the author of the annotation.
minWidth Number (0) Specifies the minimum width of the annotation.
maxWidth Number (0) Specifies the maximum width of the annotation.
minHeight Number (0) Specifies the minimum height of the annotation.
maxHeight Number (0) Specifies the maximum height of the annotation.
isLock Boolean (false) Specifies whether the annotation is locked. If true, the annotation cannot be selected.
skipPrint Boolean (true) Specifies whether the annotation is included in print actions.
skipDownload Boolean (true) Specifies whether the annotation is included in download actions.
Free Text Settings    
allowOnlyTextInput Boolean (false) Specifies text-only mode for free text annotations. If true, moving or resizing is disabled.

Change the author name and other properties using the annotationSettings API as shown below.

```ts
// app.ts
import { Component } from '@angular/core';
import { AnnotationService, AnnotationSettingsModel, BookmarkViewService, FormFieldsService, FreeTextSettingsModel, LinkAnnotationService, MagnificationService, NavigationService, PageOrganizerService, PdfViewerModule, PrintService, TextSearchService, TextSelectionService, ThumbnailViewService, ToolbarService } from '@syncfusion/ej2-angular-pdfviewer';

@Component({
  selector: 'app-root',
  imports: [ PdfViewerModule ],
  providers: [ToolbarService, MagnificationService, NavigationService, LinkAnnotationService, ThumbnailViewService, BookmarkViewService, TextSelectionService, TextSearchService, PrintService, AnnotationService, FormFieldsService, PageOrganizerService],
  template: `
    <ejs-pdfviewer id="pdfViewer"
      [documentPath]="docPath"
      [annotationSettings]="annotationSettings"
      [freeTextSettings]="freeTextSettings">
    </ejs-pdfviewer>
  `
})
export class AppComponent {
  public docPath = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf';
  public annotationSettings: AnnotationSettingsModel = {
    author: 'syncfusion', minHeight: 30, maxHeight: 500, minWidth: 30, maxWidth: 500, isLock: false, skipPrint: false, skipDownload: false
  };
  public freeTextSettings: FreeTextSettingsModel = {
    allowEditTextOnly: true
  };
}
```
```ts
// app.ts
import { Component } from '@angular/core';
import { AnnotationService, AnnotationSettingsModel, BookmarkViewService, FormFieldsService, FreeTextSettingsModel, LinkAnnotationService, MagnificationService, NavigationService, PageOrganizerService, PdfViewerModule, PrintService, TextSearchService, TextSelectionService, ThumbnailViewService, ToolbarService } from '@syncfusion/ej2-angular-pdfviewer';

@Component({
  selector: 'app-root',
  imports: [ PdfViewerModule ],
  providers: [ToolbarService, MagnificationService, NavigationService, LinkAnnotationService, ThumbnailViewService, BookmarkViewService, TextSelectionService, TextSearchService, PrintService, AnnotationService, FormFieldsService, PageOrganizerService],
  template: `
    <ejs-pdfviewer id="pdfViewer"
      [serviceUrl]="serviceUrl"
      [documentPath]="docPath"
      [annotationSettings]="annotationSettings"
      [freeTextSettings]="freeTextSettings">
    </ejs-pdfviewer>
  `
})
export class AppComponent {
  public serviceUrl: string = 'https://document.syncfusion.com/web-services/pdf-viewer/api/pdfviewer/';
  public docPath: string = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf';
  public annotationSettings: AnnotationSettingsModel = {
    author: 'syncfusion', minHeight: 30, maxHeight: 500, minWidth: 30, maxWidth: 500, isLock: false, skipPrint: false, skipDownload: false
  };
  public freeTextSettings: FreeTextSettingsModel = {
    allowEditTextOnly: true
  };
}
```