Collection
Direct Subclass:
Indirect Subclass:
Collection provides a standardized way to manipulate items in a component.
Constructor Summary
Public Constructor | ||
public |
|
Method Summary
Public Methods | ||
public |
add(item: HTMLElement | Object, insertBefore: HTMLElement): HTMLElement Adds an item to the Collection. |
|
public |
clear(): Array<HTMLElement> Removes all the items from the Collection. |
|
public |
first(): HTMLElement Returns the first item of the collection. |
|
public |
getAll(): Array<HTMLElement> Returns an array with all the items inside the Collection. |
|
public |
last(): HTMLElement Returns the last item of the collection. |
|
public |
remove(item: HTMLElement): HTMLElement Removes the given item from the Collection. |
Public Constructors
public constructor() source
Params:
Name | Type | Attribute | Description |
options.host | HTMLElement | The element that hosts the collection. |
|
options.itemTagName | String | The tag name of the elements that constitute a collection item. |
|
options.itemBaseTagName | String | The optional base tag name of the elements that constitute a collection item. This is required for elements that extend native elements, like Button. |
|
options.itemSelector | String |
|
Optional, derived from itemTagName and itemBaseTagName by default. Used to query the host element for its collection items. |
options.container | HTMLElement |
|
Optional element that wraps the collection. Defines where the new items will be added when |
options.filter | CollectionFilter |
|
Optional function used to filter the results. |
options.onItemAdded | CollectionOnItemAdded |
|
Function called once an item is added to the DOM. If the Collection has been configured to handle the items
automatically, the callback will be called once the collection detects that the item has been added to the DOM and
not synchronously with |
options.onItemRemoved | CollectionOnItemRemoved |
|
Function called once an item is removed from the DOM. If the Collection has been configured to handle the items
automatically, the callback will be called once the collection detects that the item has been removed from the DOM
not synchronously with |
options.onCollectionChange | CollectionOnChange |
|
Function called after there has been a change in the collection. This allows components to handle state changes
after an item(s) has been added or removed. This callback will only be called if the Collection is configured to
handle the items automatically.
is |
Public Methods
public add(item: HTMLElement | Object, insertBefore: HTMLElement): HTMLElement source
Adds an item to the Collection. The item can be either a HTMLElement
or an Object with the item
properties. If the index is not provided the element appended to the end. If options.onItemAdded
was
provided, it will be called after the element is added from the DOM.
Params:
Name | Type | Attribute | Description |
item | HTMLElement | Object | The item to add to the Collection. |
|
insertBefore | HTMLElement |
|
Existing item used as a reference to insert the new item before. If the value is |
Emit:
public getAll(): Array<HTMLElement> source
Returns an array with all the items inside the Collection. Each element is of type HTMLElement
.
public remove(item: HTMLElement): HTMLElement source
Removes the given item from the Collection. If options.onItemRemoved
was provided, it will be called
after the element is removed from the DOM.
Params:
Name | Type | Attribute | Description |
item | HTMLElement | The item to add to the Collection. |