mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ADF-3745] Updates for doc review (20-11-2018) (#3992)
This commit is contained in:
Andy Stark
committed by
Eugenio Romano
Eugenio Romano
parent
383b74151a
commit
0a394869f5
@@ -1,7 +1,7 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-05-08
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Card Item Type service
|
||||
@@ -13,7 +13,7 @@ Maps type names to field component types for the [Card View component](../core/c
|
||||
### Methods
|
||||
|
||||
- **getComponentTypeResolver**(type: `string`, defaultValue: `Type<__type>` = `this.defaultValue`): `DynamicComponentResolveFunction`<br/>
|
||||
Gets the currently active ComponentTypeResolver function for a field type.
|
||||
Gets the currently active DynamicComponentResolveFunction for a field type.
|
||||
- _type:_ `string` - The type whose resolver you want
|
||||
- _defaultValue:_ `Type<__type>` - Default type returned for types that are not yet mapped
|
||||
- **Returns** `DynamicComponentResolveFunction` - Resolver function
|
||||
@@ -23,7 +23,7 @@ Maps type names to field component types for the [Card View component](../core/c
|
||||
- _defaultValue:_ `Type<__type>` - Default type returned for field types that are not yet mapped.
|
||||
- **Returns** `Type<__type>` - Component type
|
||||
- **setComponentTypeResolver**(type: `string`, resolver: `DynamicComponentResolveFunction`, override: `boolean` = `true`)<br/>
|
||||
Sets or optionally replaces a ComponentTypeResolver function for a field type.
|
||||
Sets or optionally replaces a DynamicComponentResolveFunction for a field type.
|
||||
- _type:_ `string` - The type whose resolver you want to set
|
||||
- _resolver:_ `DynamicComponentResolveFunction` - The new resolver function
|
||||
- _override:_ `boolean` - The new resolver will only replace an existing one if this parameter is true
|
||||
@@ -32,7 +32,7 @@ Maps type names to field component types for the [Card View component](../core/c
|
||||
|
||||
The [Card View component](card-view.component.md) uses this service to find the component
|
||||
type that is required to display a particular field type (text, date, etc). The service
|
||||
maps a type name string to a corresponding `ComponentTypeResolver` function that takes a
|
||||
maps a type name string to a corresponding `DynamicComponentResolveFunction` that takes a
|
||||
model object as a parameter and returns the component type needed to display that model.
|
||||
|
||||
The default mapping is shown below:
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-04-10
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Context Menu directive
|
||||
@@ -53,4 +53,5 @@ export class MyComponent implements OnInit {
|
||||
|
||||
## Details
|
||||
|
||||
See **Demo Shell** or **DocumentList** implementation for more details and use cases.
|
||||
See the [Demo Shell](../../demo-shell/README.md)
|
||||
or [Document List component](../content-services/document-list.component.md) implementation for more details and use cases.
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-05-08
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Form field component
|
||||
|
||||
A form field in an APS form.
|
||||
Represents a UI field in a form.
|
||||
|
||||
## Basic Usage
|
||||
|
||||
@@ -26,7 +26,7 @@ based on the field type or the metadata information.
|
||||
|
||||
| Name | Type | Default value | Description |
|
||||
| ---- | ---- | ------------- | ----------- |
|
||||
| field | [`FormFieldModel`](../core/form-field.model.md) | null | Contains all the necessary data needed to determine what UI Widget to use when rendering the field in the form. You would typically not create this data manually but instead create the form in APS and export it to get to all the [`FormFieldModel`](../core/form-field.model.md) definitions. |
|
||||
| field | [`FormFieldModel`](../core/form-field.model.md) | null | Contains all the necessary data needed to determine what UI [`Widget`](../../e2e/pages/adf/process_services/widgets/widget.ts) to use when rendering the field in the form. You would typically not create this data manually but instead create the form in APS and export it to get to all the `FormFieldModel` definitions. |
|
||||
|
||||
## Details
|
||||
|
||||
@@ -37,8 +37,8 @@ uses `<adf-form-field>` components to render the form fields.
|
||||
|
||||
Forms defined in APS have the following default mappings for the form fields:
|
||||
|
||||
| APS [`Form`](../../lib/process-services/task-list/models/form.model.ts) Designer Widget | Field Type | Component Type |
|
||||
| --------------------------------------------------------------------------------------- | ---------- | -------------- |
|
||||
| _APS [Form](../../lib/process-services/task-list/models/form.model.ts) Designer_ [`Widget`](../../e2e/pages/adf/process_services/widgets/widget.ts) | Field Type | Component Type |
|
||||
| --------------------------------------------------------------------------------------------------------------------------------------------------- | ---------- | -------------- |
|
||||
| Text | text | [`TextWidgetComponent`](../../lib/core/form/components/widgets/text/text.widget.ts) |
|
||||
| Multi-line text | multi-line-text | [`MultilineTextWidgetComponentComponent`](../../lib/core/form/components/widgets/multiline-text/multiline-text.widget.ts) |
|
||||
| Number | integer | [`NumberWidgetComponent`](../../lib/core/form/components/widgets/number/number.widget.ts) |
|
||||
@@ -54,7 +54,7 @@ Forms defined in APS have the following default mappings for the form fields:
|
||||
| Hyperlink | hyperlink | [`HyperlinkWidgetComponent`](../../lib/core/form/components/widgets/hyperlink/hyperlink.widget.ts) |
|
||||
| Header | group | [`ContainerWidgetComponent`](../../lib/core/form/components/widgets/container/container.widget.ts) |
|
||||
| Attach File | upload | AttachWidgetComponent or [`UploadWidgetComponent`](../../lib/core/form/components/widgets/upload/upload.widget.ts) (based on metadata) |
|
||||
| Display value | readonly | [`TextWidgetComponent`] (../../lib/core/form/components/widgets/text/text.widget.ts) |
|
||||
| Display value | readonly | [`TextWidgetComponent`](../../lib/core/form/components/widgets/text/text.widget.ts) |
|
||||
| Display text | readonly-text | [`DisplayTextWidgetComponent`](../../lib/core/form/components/widgets/display-text/display-text.widget.ts) |
|
||||
| N/A | container | [`ContainerWidgetComponent`](../../lib/core/form/components/widgets/container/container.widget.ts) (layout component) |
|
||||
| N/A | N/A | [`UnknownWidgetComponent`](../../lib/core/form/components/widgets/unknown/unknown.widget.ts) |
|
||||
|
||||
@@ -1,11 +1,12 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Form List Component
|
||||
|
||||
Shows APS forms as a list.
|
||||
Shows forms as a list.
|
||||
|
||||
## Basic Usage
|
||||
|
||||
|
||||
@@ -1,19 +1,19 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-05-08
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Form Rendering service
|
||||
|
||||
Maps an APS form field type string onto the corresponding form [widget component](../insights/widget.component.md) type.
|
||||
Maps a form field type string onto the corresponding form [widget component](../insights/widget.component.md) type.
|
||||
|
||||
## Class members
|
||||
|
||||
### Methods
|
||||
|
||||
- **getComponentTypeResolver**(type: `string`, defaultValue: `Type<__type>` = `this.defaultValue`): `DynamicComponentResolveFunction`<br/>
|
||||
Gets the currently active ComponentTypeResolver function for a field type.
|
||||
Gets the currently active DynamicComponentResolveFunction for a field type.
|
||||
- _type:_ `string` - The type whose resolver you want
|
||||
- _defaultValue:_ `Type<__type>` - Default type returned for types that are not yet mapped
|
||||
- **Returns** `DynamicComponentResolveFunction` - Resolver function
|
||||
@@ -23,32 +23,32 @@ Maps an APS form field type string onto the corresponding form [widget component
|
||||
- _defaultValue:_ `Type<__type>` - Default type returned for field types that are not yet mapped.
|
||||
- **Returns** `Type<__type>` - Component type
|
||||
- **setComponentTypeResolver**(type: `string`, resolver: `DynamicComponentResolveFunction`, override: `boolean` = `true`)<br/>
|
||||
Sets or optionally replaces a ComponentTypeResolver function for a field type.
|
||||
Sets or optionally replaces a DynamicComponentResolveFunction for a field type.
|
||||
- _type:_ `string` - The type whose resolver you want to set
|
||||
- _resolver:_ `DynamicComponentResolveFunction` - The new resolver function
|
||||
- _override:_ `boolean` - The new resolver will only replace an existing one if this parameter is true
|
||||
|
||||
## Details
|
||||
|
||||
The [`Form`](../../lib/process-services/task-list/models/form.model.ts) Field component uses this service to choose which widget to use to render an instance of a
|
||||
The [`Form`](../../lib/process-services/task-list/models/form.model.ts) Field component uses this service to choose which [widget](../../e2e/pages/adf/process_services/widgets/widget.ts) to use to render an instance of a
|
||||
form field. The [`Form`](../../lib/process-services/task-list/models/form.model.ts) Field model stores the field type name as a string (see the table below).
|
||||
The [`Form`](../../lib/process-services/task-list/models/form.model.ts) Rendering service maintains a mapping between each type name and
|
||||
a corresponding ComponentTypeResolver function. The function takes a [`FormFieldModel`](../core/form-field.model.md) object as its argument and
|
||||
uses the data from the object to determine which widget should be used to render the field.
|
||||
a corresponding `DynamicComponentResolveFunction`. The function takes a [`FormFieldModel`](../core/form-field.model.md) object as its argument and
|
||||
uses the data from the object to determine which [widget](../../e2e/pages/adf/process_services/widgets/widget.ts) should be used to render the field.
|
||||
|
||||
In some cases, the field type string alone is enough to determine the widget type and so the function
|
||||
In some cases, the field type string alone is enough to determine the [widget](../../e2e/pages/adf/process_services/widgets/widget.ts) type and so the function
|
||||
just returns the type directly:
|
||||
|
||||
```ts
|
||||
let customResolver: ComponentTypeResolver = () => CustomWidgetComponent;
|
||||
let customResolver: DynamicComponentResolveFunction = () => CustomWidgetComponent;
|
||||
formRenderingService.setComponentTypeResolver('text', customResolver, true);
|
||||
```
|
||||
|
||||
In other cases, the function may need to choose the widget dynamically based on
|
||||
In other cases, the function may need to choose the [widget](../../e2e/pages/adf/process_services/widgets/widget.ts) dynamically based on
|
||||
specific values in the form data:
|
||||
|
||||
```ts
|
||||
let customResolver: ComponentTypeResolver = (field: FormFieldModel): Type<{}> => {
|
||||
let customResolver: DynamicComponentResolveFunction = (field: FormFieldModel): Type<{}> => {
|
||||
if (field) {
|
||||
let params = field.params;
|
||||
}
|
||||
@@ -94,7 +94,7 @@ if you set the `override` parameter to 'true':
|
||||
formRenderingService.setComponentTypeResolver('text', newResolver, true);
|
||||
```
|
||||
|
||||
You would typically use this to replace an existing widget with your own custom version that
|
||||
You would typically use this to replace an existing [widget](../../e2e/pages/adf/process_services/widgets/widget.ts) with your own custom version that
|
||||
implements a modified layout or responds differently when the data is entered. See the
|
||||
[Form Extensibility and Customisation](../user-guide/extensibility.md) guide for further details and examples
|
||||
of this technique.
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
---
|
||||
Added: v2.5.0
|
||||
Status: Experimental
|
||||
Last reviewed: 2018-08-07
|
||||
Status: Active
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Header component
|
||||
# Header component
|
||||
|
||||
Reusable header for Alfresco applications.
|
||||
|
||||
@@ -31,26 +31,25 @@ body of the element:
|
||||
</adf-layout-header>
|
||||
```
|
||||
|
||||
|
||||
## Class members
|
||||
|
||||
### Properties
|
||||
|
||||
| Name | Type | Description |
|
||||
| -- | -- | -- |
|
||||
| title | `string` | Title of the application
|
||||
| logo | `string` | Path to an image file for the application logo.
|
||||
| redirectUrl | `string` \| `any[]` | The router link for the application logo.
|
||||
| tooltip | `string` | The tooltip text for the application logo.
|
||||
| color | `string` | Background color for the header. It can be any hex color code or the Material theme colors: 'primary', 'accent' or 'warn'.
|
||||
| showSidenavToggle | `boolean` | Signals if the sidenav button will be displayed in the header or not. By default is true.
|
||||
| position | `string` | 'start' | The side that the drawer is attached to 'start' or 'end' page |
|
||||
| Name | Type | Default value | Description |
|
||||
| ---- | ---- | ------------- | ----------- |
|
||||
| color | `string` | | Background color for the header. It can be any hex color code or one of the Material theme colors: 'primary', 'accent' or 'warn'. |
|
||||
| logo | `string` | | Path to an image file for the application logo. |
|
||||
| position | `string` | "start" | The side of the page that the drawer is attached to (can be 'start' or 'end') |
|
||||
| redirectUrl | `string \| any[]` | "/" | The router link for the application logo, when clicked. |
|
||||
| showSidenavToggle | `boolean` | true | Toggles whether the sidenav button will be displayed in the header or not. |
|
||||
| title | `string` | | Title of the application. |
|
||||
| tooltip | `string` | | The tooltip text for the application logo. |
|
||||
|
||||
### Events
|
||||
|
||||
| Name | Type | Description |
|
||||
| -- | -- | -- |
|
||||
| clicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when click on sidenav button
|
||||
| ---- | ---- | ----------- |
|
||||
| clicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the sidenav button is clicked. |
|
||||
|
||||
## Details
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-04-10
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Highlight directive
|
||||
@@ -43,7 +43,7 @@ of that term in its content. For example:
|
||||
</div>
|
||||
```
|
||||
|
||||
...will result in the word "dance" being highlighted. Note that you must also
|
||||
This will result in the word "dance" being highlighted. Note that you must also
|
||||
specify `adf-highlight-selector`, a CSS selector that specifies which
|
||||
elements can have their contents highlighted.
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-04-10
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Node Delete directive
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-04-10
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Node Permission directive
|
||||
|
||||
Selectively disables an HTML element or Angular component
|
||||
Selectively disables an HTML element or Angular component.
|
||||
|
||||
## Contents
|
||||
|
||||
@@ -95,7 +95,9 @@ for example). You can also use it in much the same way as you would with an HTML
|
||||
```
|
||||
|
||||
To enable your own component to work with this directive, you need to implement the
|
||||
[`NodePermissionSubject`](../../lib/core/directives/node-permission.directive.ts) interface and also define it as an EXTENDIBLE_COMPONENT parent component,
|
||||
[`NodePermissionSubject`](../../lib/core/directives/node-permission.directive.ts) interface and also define it as an
|
||||
[`EXTENDIBLE_COMPONENT`](../../lib/core/interface/injection.tokens.ts)
|
||||
parent component,
|
||||
as described in the following sections.
|
||||
|
||||
### Implementing the NodePermissionSubject interface
|
||||
@@ -118,7 +120,9 @@ The directive will look up the component in the dependency injection tree,
|
||||
up to the `@Host()` component. The host component is typically the component that requests
|
||||
the dependency. However, when this component is projected into a parent component, the
|
||||
parent becomes the host. This means you must provide your component with forward referencing
|
||||
as the `EXTENDIBLE_COMPONENT` and also provide your component as a `viewProvider`:
|
||||
as the
|
||||
[`EXTENDIBLE_COMPONENT`](../../lib/core/interface/injection.tokens.ts)
|
||||
and also provide your component as a `viewProvider`:
|
||||
|
||||
```js
|
||||
import { EXTENDIBLE_COMPONENT } from '@alfresco/adf-core';
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-09-13
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Node Service
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-04-16
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Pagination Component
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
Added: v2.1.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-09-14
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Sidebar action menu component
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
Added: v2.3.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-09-14
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Sidenav Layout component
|
||||
@@ -102,9 +102,11 @@ The contents of the 3 regions can be injected through Angular's template transcl
|
||||
in the usage example above.
|
||||
|
||||
Desktop layout (screen width greater than the `stepOver` value):
|
||||
|
||||
|
||||
|
||||
Mobile layout (screen width less than the `stepOver` value):
|
||||
|
||||
|
||||
|
||||
### Template context
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-04-10
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Text Mask directive
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-04-10
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# Upload Directive
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
---
|
||||
Added: v2.0.0
|
||||
Status: Active
|
||||
Last reviewed: 2018-09-14
|
||||
Last reviewed: 2018-11-20
|
||||
---
|
||||
|
||||
# User Preferences Service
|
||||
|
||||
Stores preferences for components.
|
||||
Stores preferences for the app and for individual components.
|
||||
|
||||
## Class members
|
||||
|
||||
@@ -99,7 +99,7 @@ The service also provides quick access to a set of the "known" properties used a
|
||||
|
||||
## User Preference onChange Stream
|
||||
|
||||
Whenever a property is set with the user preference service, an `onChange` event is sent with the
|
||||
Whenever a property is set with the [user preferences service,](../core/user-preferences.service.md) an `onChange` event is sent with the
|
||||
whole set of user properties. This is useful when a component needs to react to a property change:
|
||||
|
||||
```ts
|
||||
|
||||
Reference in New Issue
Block a user