mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ADF-1729] Mark Files and Folders as Favorite (#2466)
* favorite nodes * removed fdescribe * use Output over CustomEvent * EventEmitter any
This commit is contained in:
committed by
Denys Vuika
parent
a46cf4be64
commit
892157f01c
83
docs/node-favorite.directive.md
Normal file
83
docs/node-favorite.directive.md
Normal file
@@ -0,0 +1,83 @@
|
||||
# Node Favorite directive
|
||||
|
||||
Selectively toggle nodes as favorite
|
||||
|
||||
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
|
||||
|
||||
<!-- toc -->
|
||||
|
||||
- [Basic Usage](#basic-usage)
|
||||
* [Properties](#properties)
|
||||
* [Events](#events)
|
||||
- [Details](#details)
|
||||
|
||||
<!-- tocstop -->
|
||||
|
||||
<!-- markdown-toc end -->
|
||||
|
||||
## Basic Usage
|
||||
|
||||
```html
|
||||
<adf-toolbar>
|
||||
<button md-icon-button
|
||||
(toggle)="done()"
|
||||
[adf-node-favorite]="documentList.selection">
|
||||
</button>
|
||||
</adf-toolbar>
|
||||
|
||||
<adf-document-list #documentList ...>
|
||||
...
|
||||
</adf-document-list>
|
||||
```
|
||||
|
||||
```ts
|
||||
@Component({
|
||||
selector: 'my-component'
|
||||
})
|
||||
export class MyComponent {
|
||||
|
||||
done() {
|
||||
// ...
|
||||
}
|
||||
|
||||
}
|
||||
```
|
||||
|
||||
### Properties
|
||||
|
||||
| Name | Type | Default | Description |
|
||||
| ----------------- | ------------------- | ------- | --------------------------- |
|
||||
| adf-node-favorite | MinimalNodeEntity[] | [] | Nodes to toggle as favorite |
|
||||
|
||||
### Events
|
||||
|
||||
| Name | Description |
|
||||
| ------------------------- | -------------------------------------------- |
|
||||
| toggle | emitted when toggle favorite process is done |
|
||||
|
||||
## Details
|
||||
|
||||
The `NodeFavoriteDirective` instance can be bound to a template variable through **adfFavorite** reference,
|
||||
wich provides a method to help further style the element.
|
||||
|
||||
```html
|
||||
<button
|
||||
md-menu-item
|
||||
#selection="adfFavorite"
|
||||
[ngClass]="{ 'icon-highlight': selection.hasFavorites() }"
|
||||
[adf-node-favorite]="documentList.selection">
|
||||
<md-icon [ngClass]="{ 'icon-highlight': selection.hasFavorites() }">
|
||||
{{ selection.hasFavorites() ? 'star' : 'star_border' }}
|
||||
</md-icon>
|
||||
</button>
|
||||
```
|
||||
|
||||
The directive performs as follows:
|
||||
|
||||
- if there are no favorite nodes in the selection, then all are marked as favorites
|
||||
- if there is at least one favorite node in the selection, then only those who are not
|
||||
are being marked
|
||||
- if all nodes in the selection are favorites, then they are removed from favorites
|
||||
|
||||
|
||||
See **Demo Shell**
|
Reference in New Issue
Block a user