mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-12 17:04:57 +00:00
* [ADF-3587] Fixed missing docs for accessor properties * [ADF-3587] Fixed badly formed doc comments with deprecated tag * [ADF-3587] Fixed linting issue with doc comment
69 lines
1.8 KiB
Markdown
69 lines
1.8 KiB
Markdown
---
|
|
Added: v2.0.0
|
|
Status: Active
|
|
Last reviewed: 2018-05-08
|
|
---
|
|
|
|
# Accordion Group component
|
|
|
|
Adds a collapsible panel to an accordion menu.
|
|
|
|

|
|
|
|
## Basic Usage
|
|
|
|
```html
|
|
<adf-accordion>
|
|
<adf-accordion-group [heading]="titleHeading" [isSelected]="true" [headingIcon]="'assignment'" [headingIconTooltip]="'Group Tooltip'">
|
|
<my-list></my-list>
|
|
</adf-accordion-group>
|
|
</adf-accordion>
|
|
```
|
|
|
|
```ts
|
|
@Component({
|
|
selector: 'my-component'
|
|
})
|
|
export class MyComponent implements OnInit {
|
|
|
|
titleHeading: string;
|
|
|
|
constructor() {
|
|
this.titleHeading = 'My Group';
|
|
}
|
|
|
|
}
|
|
```
|
|
|
|
### [Transclusions](../user-guide/transclusion.md)
|
|
|
|
Any content can be trancluded inside this component, since its purpose is to
|
|
define a section in a surrounding [Accordion component](accordion.component.md).
|
|
|
|
## Class members
|
|
|
|
### Properties
|
|
|
|
| Name | Type | Default value | Description |
|
|
| ---- | ---- | ------------- | ----------- |
|
|
| hasAccordionIcon | `boolean` | true | Should the (expanded) accordion icon be shown? |
|
|
| heading | `string` | | Title heading for the group. |
|
|
| headingIcon | `string` | | The material design icon. |
|
|
| headingIconTooltip | `string` | | Tooltip message to be shown for headingIcon |
|
|
| isOpen | `boolean` | | Is this group currently open? |
|
|
| isSelected | `boolean` | | Is this group currently selected? |
|
|
|
|
### Events
|
|
|
|
| Name | Type | Description |
|
|
| ---- | ---- | ----------- |
|
|
| headingClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the heading is clicked. |
|
|
|
|
## Details
|
|
|
|
Place one or more accordion groups within an [Accordion component](accordion.component.md) to define a menu.
|
|
|
|
## See also
|
|
|
|
- [Accordion component](accordion.component.md)
|