This commit is contained in:
eromano
2022-11-25 12:33:14 +01:00
committed by Amedeo Lepore
parent 166056874c
commit 76bb642423
167 changed files with 1076 additions and 1002 deletions

View File

@@ -0,0 +1,474 @@
---
Title: Alfresco Viewer component
Added: 6.0.0
Status: Active
---
# [Alfresco Viewer component](../../../lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts "Defined in alfresco-viewer.component.ts")
Displays content from an ACS repository.
See it live: [Viewer Quickstart](https://embed.plnkr.co/iTuG1lFIXfsP95l6bDW6/)
## Contents
- [Basic usage](#basic-usage)
- [Transclusions](#transclusions)
- [Class members](#class-members)
- [Properties](#properties)
- [Events](#events)
- [Keyboard shortcuts](#keyboard-shortcuts)
- [Details](#details)
- [Integrating with the Document List component](#integrating-with-the-document-list-component)
- [Supported file formats](#supported-file-formats)
- [Content Renditions](#content-renditions)
- [Configuring PDF.js library](#configuring-pdfjs-library)
- [Extending the Viewer](#extending-the-viewer)
- [Custom layout](#custom-layout)
- [Printing](#printing)
- [See also](#see-also)
## Basic usage
Using with node id:
```html
<adf-alfresco-viewer
[showViewer]="true"
[overlayMode]="true"
[nodeId]="'d367023a-7ebe-4f3a-a7d0-4f27c43f1045'">
</adf-alfresco-viewer>
```
Using with shared link:
```html
<adf-alfresco-viewer
[overlayMode]="true"
[sharedLinkId]="'WWDg_afiTU6lHEgr4fAbQA'">
</adf-alfresco-viewer>
```
Note that if you have a URL which contains a shared link ID, you should extract the
ID portion and use it with the `sharedLinkId` property rather than using the whole
URL with `urlFile`.
### [Transclusions](../../user-guide/transclusion.md)
The [Alfresco Viewer component](viewer.component.md) lets you transclude content for the toolbar (and toolbar buttons),
the sidebar, thumbnails, and the "Open with" and "More actions" menus.
See the [Custom layout](#custom-layout) section for full details of all available tranclusions.
## Class members
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| allowDownload | `boolean` | true | Toggles downloading. |
| allowGoBack | `boolean` | true | Allows `back` navigation |
| allowLeftSidebar | `boolean` | false | Allow the left the sidebar. |
| allowNavigate | `boolean` | false | Toggles before/next navigation. You can use the arrow buttons to navigate between documents in the collection. |
| allowPrint | `boolean` | false | Toggles printing. |
| allowRightSidebar | `boolean` | false | Allow the right sidebar. |
| canNavigateBefore | `boolean` | true | Toggles the "before" ("&lt;") button. Requires `allowNavigate` to be enabled. |
| canNavigateNext | `boolean` | true | Toggles the next (">") button. Requires `allowNavigate` to be enabled. |
| maxRetries | `number` | 30 | Number of times the Viewer will retry fetching content Rendition. There is a delay of at least one second between attempts. |
| nodeId | `string` | null | Node Id of the file to load. |
| overlayMode | `boolean` | false | If `true` then show the Viewer as a full page over the current content. Otherwise fit inside the parent div. |
| sharedLinkId | `string` | null | Shared link id (to display shared file). |
| showLeftSidebar | `boolean` | false | Toggles left sidebar visibility. Requires `allowLeftSidebar` to be set to `true`. |
| showRightSidebar | `boolean` | false | Toggles right sidebar visibility. Requires `allowRightSidebar` to be set to `true`. |
| showToolbar | `boolean` | true | Hide or show the toolbar |
| showViewer | `boolean` | true | Hide or show the viewer |
| sidebarLeftTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`<any>` | null | The template for the left sidebar. The template context contains the loaded node data. |
| sidebarRightTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`<any>` | null | The template for the right sidebar. The template context contains the loaded node data. |
| versionId | `string` | null | Version Id of the file to load. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| close | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the viewer close |
| invalidSharedLink | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the shared link used is not valid. |
| navigateBefore | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<KeyboardEvent \| MouseEvent>` | Emitted when user clicks 'Navigate Before' ("&lt;") button. |
| navigateNext | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<KeyboardEvent \| MouseEvent>` | Emitted when user clicks 'Navigate Next' (">") button. |
## Keyboard shortcuts
| Name | Description |
| ---- | ----------- |
| Esc | Close the viewer (overlay mode only). |
| Left | Invoke 'Navigate before' action. |
| Right | Invoke 'Navigate next' action. |
| Ctrl+F | Activate full-screen mode. |
## Details
### Integrating with the Document List component
Below is the most simple integration of the Viewer and
[Document List](../../content-services/components/document-list.component.md) components within your custom component:
```html
<adf-document-list
currentFolderId="-my-"
(preview)="showPreview($event)">
</adf-document-list>
<adf-alfresco-viewer
[(showViewer)]="showViewer"
[overlayMode]="true"
[nodeId]="nodeId">
</adf-alfresco-viewer>
```
The component controller class implementation might look like the following:
```ts
export class OverlayViewerComponent {
@Input()
showViewer: boolean = false;
nodeId: string;
showPreview(event) {
if (event.value.entry.isFile) {
this.nodeId = event.value.entry.id;
this.showViewer = true;
}
}
}
```
### Supported file formats
The [Alfresco Viewer component](viewer.component.md) consists of separate Views that handle particular file types or type families based on either a file extension or a mime type:
- PDF View
- application/pdf
- \*.pdf
- Image View
- image/png
- image/jpeg
- image/gif
- image/bmp
- image/svg+xml
- \*.png
- \*.jpg
- \*.jpeg
- \*.gif
- \*.bpm
- \*.svg
- Text View
- text/plain
- text/csv
- text/xml
- text/html
- application/x-javascript
- \*.txt
- \*.xml
- \*.js
- \*.html
- \*.json
- \*.ts
- Media View
- video/mp4
- video/webm
- video/ogg
- audio/mpeg
- audio/ogg
- audio/wav
- \*.wav
- \*.mp4
- \*.mp3
- \*.webm
- \*.ogg
### Content Renditions
For those extensions and mime types that cannot be natively displayed in the browser, the Viewer will try to fetch the corresponding rendition using the [renditions service api](../services/renditions.service.md).
For the full list of supported types please refer to: [File types that support preview and thumbnail generation](http://docs.alfresco.com/5.2/references/valid-transformations-preview.html).
### Configuring PDF.js library
Configure your webpack-enabled application with the PDF.js library as follows.
1. Install pdfjs-dist
```sh
npm install pdfjs-dist
```
2. Update `vendors.ts` by appending the following code. This will enable the [Alfresco Viewer component](viewer.component.md)
and compatibility mode for all browsers. It will also configure the web worker for the PDF.js
library to render PDF files in the background:
```ts
// PDF.js
require('pdfjs-dist/web/compatibility.js');
const pdfjsLib = require('pdfjs-dist');
pdfjsLib.PDFJS.workerSrc = './pdf.worker.js';
require('pdfjs-dist/web/pdf_viewer.js');
```
3. Update the `plugins` section of the `webpack.common.js` file with the following lines:
```js
new CopyWebpackPlugin([
...
{
from: 'node_modules/pdfjs-dist/build/pdf.worker.js',
to: 'pdf.worker.js'
}
])
```
### Extending the Viewer
#### Internal extension mechanism
The Viewer supports dynamically-loaded viewer preview extensions, to know more about it [Preview Extension component](../../extensions/components/preview-extension.component.md). This
#### Code extension mechanism]
You can define your own custom handler to handle other file formats that are not yet supported by
the [Alfresco Viewer component](viewer.component.md). Below is an example that shows how to use the `adf-viewer-extension`
to handle 3D data files:
```html
<adf-alfresco-viewer [nodeId]="nodeId">
<adf-viewer-extension [supportedExtensions]="['obj','3ds']" #extension>
<ng-template let-urlFileContent="urlFileContent" let-extension="extension">
<threed-viewer
[urlFile]="urlFileContent"
[extension]="extension">
</threed-viewer>
</ng-template>
</adf-viewer-extension>
</adf-alfresco-viewer>
```
Note: you need to add the `ng2-3d-editor` dependency to your `package.json` file to make the example above work.
You can define multiple `adf-viewer-extension` templates if required:
```html
<adf-alfresco-viewer [nodeId]="nodeId">
<adf-viewer-extension [supportedExtensions]="['xls','xlsx']" #extension>
<ng-template let-urlFileContent="urlFileContent">
<my-custom-xls-component
urlFileContent="urlFileContent">
</my-custom-xls-component>
</ng-template>
</adf-viewer-extension>
<adf-viewer-extension [supportedExtensions]="['txt']" #extension>
<ng-template let-urlFileContent="urlFileContent" >
<my-custom-txt-component
urlFileContent="urlFileContent">
</my-custom-txt-component>
</ng-template>
</adf-viewer-extension>
</adf-alfresco-viewer>
```
### Custom layout
The [Alfresco Viewer Component](viewer.component.md) lets you transclude custom content in several different places as
explained in the sections below.
#### Custom toolbar
You can replace the standard viewer toolbar with your own custom implementation:
```html
<adf-alfresco-viewer>
<adf-alfresco-viewer-toolbar>
<h1>toolbar</h1>
</adf-alfresco-viewer-toolbar>
</adf-alfresco-viewer>
```
Everything you put inside the "adf-alfresco-viewer-toolbar" tags will be rendered instead of the
standard toolbar.
#### Custom toolbar buttons
If you are happy with the custom toolbar's behaviour but want to add some extra buttons
then you can do so as shown in the following example:
```html
<adf-alfresco-viewer>
<adf-alfresco-viewer-toolbar-actions>
<button mat-icon-button>
<mat-icon>alarm</mat-icon>
</button>
<button mat-icon-button>
<mat-icon>backup</mat-icon>
</button>
<button mat-icon-button>
<mat-icon>bug_report</mat-icon>
</button>
</adf-alfresco-viewer-toolbar-actions>
</adf-alfresco-viewer>
```
The result should look like this:
![Custom Toolbar Actions](../../docassets/images/viewer-toolbar-actions.png)
#### Custom sidebar
The [Alfresco Viewer Component](viewer.component.md) also supports custom sidebar components and layouts.
Set the `allowRightSidebar` property to `true` to enable this feature.
The custom sidebar can be injected in two different ways. The first way is to use
transclusion, which will display all content placed inside the `<adf-alfresco-viewer-sidebar>` element:
```html
<adf-alfresco-viewer [allowRightSidebar]="true">
<adf-alfresco-viewer-sidebar>
<h1>My info</h1>
</adf-alfresco-viewer-sidebar>
</adf-alfresco-viewer>
```
The second way to customize the sidebar is to use template injection but note that this only works
when using the viewer with `nodeId`.
```html
<ng-template let-node="node" #sidebarTemplate>
<adf-content-metadata-card [node]="node"></adf-content-metadata-card>
</ng-template>
<adf-alfresco-viewer [allowRightSidebar]="true" [sidebarRightTemplate]="sidebarTemplate"></adf-alfresco-viewer>
```
#### Custom thumbnails
The PDF viewer comes with its own default list of thumbnails but you can replace this
by providing a custom template and binding to the context property `viewer` to access the PDFJS.PDFViewer
instance.
![PDF thumbnails](../../docassets/images/pdf-thumbnails.png)
Provide the custom template as in the following example:
```javascript
import { Component, Input } from '@angular/core';
@Component({
selector: 'custom-thumbnails',
template: '<p> Custom Thumbnails Component </p>'
})
export class CustomThumbnailsComponent {
@Input() pdfViewer: any;
...
}
```
```html
<ng-template #customThumbnailsTemplate let-pdfViewer="viewer">
<custom-thumbnails [pdfViewer]="pdfViewer"></custom-thumbnails>
</ng-template>
<adf-alfresco-viewer [thumbnailsTemplate]="customThumbnailsTemplate"></adf-alfresco-viewer>
```
#### Custom "Open With" menu
You can enable a custom "Open With" menu by providing at least one action inside the
`adf-alfresco-viewer-open-with` tag:
```html
<adf-alfresco-viewer [nodeId]="nodeId">
<adf-alfresco-viewer-open-with>
<button mat-menu-item>
<mat-icon>dialpad</mat-icon>
<span>Option 1</span>
</button>
<button mat-menu-item disabled>
<mat-icon>voicemail</mat-icon>
<span>Option 2</span>
</button>
<button mat-menu-item>
<mat-icon>notifications_off</mat-icon>
<span>Option 3</span>
</button>
</adf-alfresco-viewer-open-with>
</adf-alfresco-viewer>
```
![Open with](../../docassets/images/viewer-open-with.png)
#### Custom "More actions" menu
You can enable a custom "More actions" menu by providing at least one action inside the `adf-alfresco-viewer-more-actions` tag:
```html
<adf-alfresco-viewer [nodeId]="nodeId">
<adf-alfresco-viewer-more-actions>
<button mat-menu-item>
<mat-icon>dialpad</mat-icon>
<span>Action One</span>
</button>
<button mat-menu-item disabled>
<mat-icon>voicemail</mat-icon>
<span>Action Two</span>
</button>
<button mat-menu-item>
<mat-icon>notifications_off</mat-icon>
<span>Action Three</span>
</button>
</adf-alfresco-viewer-more-actions>
</adv-viewer>
```
![More actions](../../docassets/images/viewer-more-actions.png)
#### Custom zoom scaling
You can set a default zoom scaling value for pdf viewer by adding the following code in `app.config.json`.
Note: For the pdf viewer the value has to be within the range of 25 - 1000.
"adf-alfresco-viewer": {
"pdf-viewer-scaling": 150
}
In the same way you can set a default zoom scaling value for the image viewer by adding the following code in `app.config.json`.
"adf-alfresco-viewer": {
"image-viewer-scaling": 150
}
By default the viewer's zoom scaling is set to 100%.
### Printing
You can configure the Viewer to let the user print the displayed content. The
component will show a "Print" button if the `allowPrint` property is set to
true.
```html
<adf-alfresco-viewer [allowPrint]="true">
...
</adf-alfresco-viewer>
```
You can also use the `print` event to get notification when the user prints some
content.
## See also
- [Document List component](../../content-services/components/document-list.component.md)
- [Preview Extension component](../../extensions/components/preview-extension.component.md)

View File

@@ -57,7 +57,7 @@ Displays the documents from a repository.
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| additionalSorting | [`DataSorting`](lib/core/src/lib/datatable/data/data-sorting.model.ts) | | Defines default sorting. The format is an array of strings `[key direction, otherKey otherDirection]` i.e. `['name desc', 'nodeType asc']` or `['name asc']`. Set this value if you want a base rule to be added to the sorting apart from the one driven by the header. |
| additionalSorting | [`DataSorting`](../../../lib/core/src/lib/datatable/data/data-sorting.model.ts) | | Defines default sorting. The format is an array of strings `[key direction, otherKey otherDirection]` i.e. `['name desc', 'nodeType asc']` or `['name asc']`. Set this value if you want a base rule to be added to the sorting apart from the one driven by the header. |
| allowDropFiles | `boolean` | false | When true, this enables you to drop files directly into subfolders shown as items in the list or into another file to trigger updating it's version. When false, the dropped file will be added to the current folder (ie, the one containing all the items shown in the list). See the [Upload directive](../../core/directives/upload.directive.md) for further details about how the file drop is handled. |
| contentActions | `boolean` | false | Toggles content actions for each row |
| contentActionsPosition | `string` | "right" | Position of the content actions dropdown menu. Can be set to "left" or "right". |
@@ -82,7 +82,7 @@ Displays the documents from a repository.
| rowStyleClass | `string` | | The CSS class to apply to every row |
| selectionMode | `string` | "single" | Row selection mode. Can be null, `single` or `multiple`. For `multiple` mode, you can use Cmd (macOS) or Ctrl (Win) modifier key to toggle selection for multiple rows. |
| showHeader | `ShowHeaderMode` | | Toggles the header |
| sorting | `string[] \| `[`DataSorting`](../../../lib/core/datatable/data/data-sorting.model.ts) | ['name', 'asc'] | Defines default sorting. The format is an array of 2 strings `[key, direction]` i.e. `['name', 'desc']` or `['name', 'asc']`. Set this value only if you want to override the default sorting detected by the component based on columns. |
| sorting | `string[] \| `[`DataSorting`](../../../lib/core/src/lib/datatable/data/data-sorting.model.ts) | ['name', 'asc'] | Defines default sorting. The format is an array of 2 strings `[key, direction]` i.e. `['name', 'desc']` or `['name', 'asc']`. Set this value only if you want to override the default sorting detected by the component based on columns. |
| sortingMode | `"server" \| "client"` | "server" | Defines sorting mode. Can be either `client` (items in the list are sorted client-side) or `server` (the ordering supplied by the server is used without further client-side sorting). Note that the `server` option _does not_ request the server to sort the data before delivering it. |
| stickyHeader | `boolean` | false | Toggles the sticky header mode. |
| thumbnails | `boolean` | false | Show document thumbnails rather than icons |
@@ -99,7 +99,7 @@ Displays the documents from a repository.
| nodeClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`NodeEntityEvent`](../../../lib/content-services/src/lib/document-list/components/node.event.ts)`>` | Emitted when the user clicks a list node |
| nodeDblClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`NodeEntityEvent`](../../../lib/content-services/src/lib/document-list/components/node.event.ts)`>` | Emitted when the user double-clicks a list node |
| nodeSelected | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`NodeEntry`](https://github.com/Alfresco/alfresco-js-api/blob/master/src/alfresco-core-rest-api/docs/NodeEntry.md)`[]>` | Emitted when the node selection change |
| preview | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`NodeEntityEvent`](../../../lib/content-services/src/lib/document-list/components/node.event.ts)`>` | Emitted when the user acts upon files with either single or double click (depends on `navigation-mode`). Useful for integration with the [Viewer component](../../core/components/viewer.component.md). |
| preview | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`NodeEntityEvent`](../../../lib/content-services/src/lib/document-list/components/node.event.ts)`>` | Emitted when the user acts upon files with either single or double click (depends on `navigation-mode`). Useful for integration with the Viewer component. |
| ready | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`NodePaging`](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/content-rest-api/docs/NodePaging.md)`>` | Emitted when the Document List has loaded all items and is ready for use |
## Details

View File

@@ -48,7 +48,7 @@ Activates a file upload.
| Name | Type | Description |
| ---- | ---- | ----------- |
| beginUpload | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`UploadFilesEvent`](../../../lib/content-services/src/lib/upload/components/upload-files.event.ts)`>` | Emitted when the upload begins. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadErrorEvent`](../../../lib/core/events/file.event.ts)`>` | Emitted when an error occurs. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadErrorEvent`](../../../lib/core/src/lib/events/file.event.ts)`>` | Emitted when an error occurs. |
| permissionEvent | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PermissionModel`](../../../lib/content-services/src/lib/document-list/models/permissions.model.ts)`>` | Emitted when create permission is missing. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the file is uploaded successfully. |
| updateFileVersion | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<CustomEvent<any>>` | Emitted when dropping a file over another file to update the version. |

View File

@@ -75,7 +75,7 @@ as the drag/drop target:
| Name | Type | Description |
| ---- | ---- | ----------- |
| beginUpload | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`UploadFilesEvent`](../../../lib/content-services/src/lib/upload/components/upload-files.event.ts)`>` | Emitted when the upload begins. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadErrorEvent`](../../../lib/core/events/file.event.ts)`>` | Emitted when an error occurs. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadErrorEvent`](../../../lib/core/src/lib/events/file.event.ts)`>` | Emitted when an error occurs. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the file is uploaded successfully. |
| updateFileVersion | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<CustomEvent<any>>` | Emitted when dropping a file over another file to update the version. |
@@ -87,7 +87,7 @@ You can intercept the upload process using the `beginUpload` event.
The event has a type of [`UploadFilesEvent`](../../../lib/content-services/src/lib/upload/components/upload-files.event.ts) and provides the following APIs:
- **files**: accesses the [`FileInfo`](lib/core/src/lib/utils/file-utils.ts) objects that are prepared for the upload
- **files**: accesses the [`FileInfo`](../../../lib/core/src/lib/utils/file-utils.ts) objects that are prepared for the upload
- **pauseUpload**: pauses the upload and performs additional tasks, like showing the confirmation dialog
- **resumeUpload**: resumes the upload process

View File

@@ -51,7 +51,7 @@ to enrich the features and decrease the restrictions currently applied to node v
| Name | Type | Description |
| ---- | ---- | ----------- |
| beginUpload | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`UploadFilesEvent`](../../../lib/content-services/src/lib/upload/components/upload-files.event.ts)`>` | Emitted when the upload begins. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadErrorEvent`](../../../lib/core/events/file.event.ts)`>` | Emitted when an error occurs. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadErrorEvent`](../../../lib/core/src/lib/events/file.event.ts)`>` | Emitted when an error occurs. |
| permissionEvent | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PermissionModel`](../../../lib/content-services/src/lib/document-list/models/permissions.model.ts)`>` | Emitted when create permission is missing. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the file is uploaded successfully. |
| updateFileVersion | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<CustomEvent<any>>` | Emitted when dropping a file over another file to update the version. |

View File

@@ -40,7 +40,7 @@ Displays the version history of a node with the ability to upload a new version.
| Name | Type | Description |
| ---- | ---- | ----------- |
| uploadCancel | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when an cancelling during upload. |
| uploadError | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadErrorEvent`](../../../lib/core/events/file.event.ts)`>` | Emitted when an error occurs during upload. |
| uploadError | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadErrorEvent`](../../../lib/core/src/lib/events/file.event.ts)`>` | Emitted when an error occurs during upload. |
| uploadSuccess | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<Node>` | Emitted when a file is uploaded successfully. |
| viewVersion | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string>` | Emitted when viewing a version. |

View File

@@ -33,9 +33,9 @@ Displays the new version's minor/major changes and the optional comment of a nod
| ---- | ---- | ----------- |
| cancel | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when an cancelling during upload. |
| commentChanged | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string>` | Emitted when the comment is changed. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadErrorEvent`](../../../lib/core/events/file.event.ts)`>` | Emitted when an error occurs. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadErrorEvent`](../../../lib/core/src/lib/events/file.event.ts)`>` | Emitted when an error occurs. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the file is uploaded successfully. |
| uploadStarted | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadEvent`](../../../lib/core/events/file.event.ts)`>` | Emitted when the upload starts |
| uploadStarted | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FileUploadEvent`](../../../lib/core/src/lib/events/file.event.ts)`>` | Emitted when the upload starts |
| versionChanged | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the version is changed. |
## Details