mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-12 17:04:57 +00:00
1fa81962a0
* fix after rebase * new release strategy for ng next Signed-off-by: eromano <eugenioromano16@gmail.com> * peer dep Signed-off-by: eromano <eugenioromano16@gmail.com> * Angular 14 fix unit test and storybook Signed-off-by: eromano <eugenioromano16@gmail.com> fix after rebase Signed-off-by: eromano <eugenioromano16@gmail.com> update pkg.json Signed-off-by: eromano <eugenioromano16@gmail.com> missing dep Signed-off-by: eromano <eugenioromano16@gmail.com> Fix mistake and missing code Dream....build only affected libs Add utility run commands * Use nx command to run affected tests * Fix nx test core fix content tests Run unit with watch false core test fixes reduce test warnings Fix process cloud unit Fix adf unit test Fix lint process cloud Disable lint next line Use right core path Fix insights unit fix linting insights Fix process-services unit fix the extensions test report fix test warnings Fix content unit Fix bunch of content unit * Produce an adf alpha of 14 * hopefully fixing the content * Push back the npm publish * Remove flaky unit * Fix linting * Make the branch as root * Get rid of angualar13 * Remove the travis depth * Fixing version for npm * Enabling cache for unit and build * Fix scss for core and paths Copy i18 and asset by using ng-packager Export the theming alias and fix path Use ng-package to copy assets process-services-cloud Use ng-package to copy assets process-services Use ng-package to copy assets content-services Use ng-package to copy assets insights * feat: fix api secondary entry point * fix storybook rebase * Move dist under dist/libs from lib/dist * Fix the webstyle * Use only necessary nrwl deps and improve lint * Fix unit for libs * Convert lint.sh to targets - improve performance * Use latest of angular * Align alfresco-js-api Signed-off-by: eromano <eugenioromano16@gmail.com> Co-authored-by: eromano <eugenioromano16@gmail.com> Co-authored-by: Mikolaj Serwicki <mikolaj.serwicki@hyland.com> Co-authored-by: Tomasz <tomasz.gnyp@hyland.com>
93 lines
3.2 KiB
Markdown
93 lines
3.2 KiB
Markdown
---
|
|
Title: Image Resolver Model
|
|
Added: v2.0.0
|
|
Status: Active
|
|
Last reviewed: 2019-02-08
|
|
---
|
|
|
|
# [Image Resolver Model](../../../lib/content-services/document-list/data/image-resolver.model.ts "Defined in image-resolver.model.ts")
|
|
|
|
Defines the Image Resolver function used by the [Document List Component](../components/document-list.component.md).
|
|
|
|
## Definitions
|
|
|
|
- `type` **[`ImageResolver`](../../../lib/content-services/src/lib/document-list/data/image-resolver.model.ts)** = (row: [`DataRow`](lib/core/src/lib/datatable/data/data-row.model.ts), column: [`DataColumn`](lib/core/src/lib/datatable/data/data-column.model.ts)) => `string`
|
|
- _row:_ [`DataRow`](lib/core/src/lib/datatable/data/data-row.model.ts) - Data that defines the row
|
|
- _column:_ [`DataColumn`](lib/core/src/lib/datatable/data/data-column.model.ts) - Data that defines the column
|
|
- **Returns** File path for the image
|
|
|
|
## Details
|
|
|
|
An image resolver function selects an image file path for an item in
|
|
a [Document List Component](../components/document-list.component.md)
|
|
or another component that uses the Document List (such as the
|
|
[Content Node Selector Panel Component](../components/content-node-selector-panel.component.md)). You can supply your own image resolver
|
|
to manage the way folder/file icons and thumbnails are resolved (ie, which image is shown for which item).
|
|
|
|
**Note:** Image resolvers are executed only for columns of the `image` type.
|
|
|
|
A typical image resolver implementation receives [`DataRow`](lib/core/src/lib/datatable/data/data-row.model.ts) and [`DataColumn`](lib/core/src/lib/datatable/data/data-column.model.ts) objects as parameters:
|
|
|
|
```ts
|
|
myImageResolver(row: DataRow, col: DataColumn): string {
|
|
return '/path/to/image';
|
|
}
|
|
```
|
|
|
|
Your function can return `null` or `false` values to fall back to the default image
|
|
resolving behavior.
|
|
|
|
_Note that for the sake of simplicity the example code below was reduced to the main points of interest only._
|
|
|
|
**View1.component.html**
|
|
|
|
```html
|
|
<adf-document-list
|
|
[imageResolver]="folderImageResolver">
|
|
|
|
<data-columns>
|
|
<data-column key="name" type="image"></data-column>
|
|
</data-columns>
|
|
|
|
</adf-document-list>
|
|
```
|
|
|
|
**View1.component.ts**
|
|
|
|
```ts
|
|
import { DataColumn, DataRow } from '@alfresco/adf-core';
|
|
import { ImageResolver } from '@alfresco/adf-content-services';
|
|
|
|
export class View1 {
|
|
|
|
folderImageResolver: ImageResolver;
|
|
|
|
constructor() {
|
|
|
|
// Customize folder icons, leave file icons untouched
|
|
|
|
this.folderImageResolver = (row: DataRow, col: DataColumn) => {
|
|
let isFolder = <boolean> row.getValue('isFolder');
|
|
if (isFolder) {
|
|
|
|
// (optional) You may want dynamically getting the column value
|
|
let name = row.getValue(col.key);
|
|
|
|
// Format image url
|
|
return `http://<my custom path to folder icon>/${name}`;
|
|
}
|
|
|
|
// For the rest of the cases just fallback to default behaviour.
|
|
return null;
|
|
};
|
|
|
|
}
|
|
|
|
}
|
|
```
|
|
|
|
## See also
|
|
|
|
- [Document List Component](../components/document-list.component.md)
|
|
- [Content Node Selector Panel Component](../components/content-node-selector-panel.component.md)
|