ec.components documentation
  1. Components
  2. AssetListComponent

File

packages/data/src/lib/asset-list/asset-list.component.ts

Extends

ResourceListComponent

Implements

OnInit

Metadata

selector ec-asset-list
templateUrl ./asset-list.component.html

Index

Properties
Methods
Inputs
Outputs

Inputs

api
Type : Core
Inherited from ResourceListComponent
Defined in ResourceListComponent:44

The API Connector that possesses the resource list, see https://entrecode.github.io/ec.sdk/#api-connectors

listResource
Type : ListResource
Inherited from ResourceListComponent
Defined in ResourceListComponent:36

If listResource input is set, the given ListResource will be used directly and loading will be skipped.

loader
Type : LoaderComponent
Inherited from ResourceListComponent
Defined in ResourceListComponent:48

The loader that should be shown while the list is loaded.

loadWhen
Type : boolean
Inherited from ResourceListComponent
Defined in ResourceListComponent:40

If set to false, the list will wait for the flag to turn true before loading.

relation
Type : string
Inherited from ResourceListComponent
Defined in ResourceListComponent:46

The name of the resource. If given, the generic ListResource loading will be used (api.resourceList)

solo
Type : boolean
Inherited from ResourceListComponent
Defined in ResourceListComponent:38

If true, only one item is selectable next

autoFocusFirst
Default value : false
Inherited from ListComponent
Defined in ListComponent:58

If true, the first item in the list will always be focused after changed

collection
Type : Collection<T>
Inherited from ListComponent
Defined in ListComponent:42

The used collection

config
Type : ListConfig<T>
Inherited from ListComponent
Defined in ListComponent:38
items
Type : Array<T>
Inherited from ListComponent
Defined in ListComponent:40

The visible items

list
Type : List<T>
Inherited from ListComponent
Defined in ListComponent:52

The Instance of the List

pagination
Type : Pagination<T>
Inherited from ListComponent
Defined in ListComponent:54

Pagination that should be used

paginationConfig
Type : PaginationConfig
Inherited from ListComponent
Defined in ListComponent:56

Custom PaginationConfig

selection
Type : Selection<T>
Inherited from ListComponent
Defined in ListComponent:44

The used selection

solo
Type : boolean
Inherited from ListComponent
Defined in ListComponent:46

If true, only one item is selectable next

Outputs

changed
Type : EventEmitter<List<T>>
Inherited from ListComponent
Defined in ListComponent:62

emits after the list changed

columnClicked
Type : EventEmitter<Item<T>>
Inherited from ListComponent
Defined in ListComponent:48

Event emitter on item selection

selected
Type : EventEmitter<Selection<T>>
Inherited from ListComponent
Defined in ListComponent:50

Event emitter on selection change

Methods

ngOnInit
ngOnInit()
Defined in packages/data/src/lib/asset-list/asset-list.component.ts:9
Returns : void
Protected createList
createList()
Inherited from ResourceListComponent
Defined in ResourceListComponent:71

The method to create the list

Returns : Promise | ResourceList
filter
filter(property: string, value: any)
Inherited from ResourceListComponent
Defined in ResourceListComponent:133

This method will filter the list by a given property value and optional operator.

Parameters :
Name Type Optional
property string No
value any No
Returns : Promise<any>
initFilterQuery
initFilterQuery(fieldFilter: (property: string,value: any) => void)
Inherited from ResourceListComponent
Defined in ResourceListComponent:137
Parameters :
Name Type Optional
fieldFilter function No
Returns : void
ngOnChanges
ngOnChanges(changes?)
Inherited from ResourceListComponent
Defined in ResourceListComponent:124

When changing the model or the config, the list will update

Parameters :
Name Optional
changes Yes
Returns : void
ngOnDestroy
ngOnDestroy()
Inherited from ResourceListComponent
Defined in ResourceListComponent:88
Returns : void
update
update()
Inherited from ResourceListComponent
Defined in ResourceListComponent:92

Creates/Updates the list and subscribes Observables.

Returns : void
columnClick
columnClick(item)
Inherited from ListComponent
Defined in ListComponent:104

Column click handler. Triggers select.emit(item) with fallback to selection.toggle

Parameters :
Name Optional
item No
Returns : any
filter
filter(property, value)
Inherited from ListComponent
Defined in ListComponent:162

Filters the list

Parameters :
Name Optional
property No
value No
Returns : void
focusFirst
focusFirst()
Inherited from ListComponent
Defined in ListComponent:130
Returns : void
focusNext
focusNext()
Inherited from ListComponent
Defined in ListComponent:136

Selects the next item

Returns : void
focusPrev
focusPrev()
Inherited from ListComponent
Defined in ListComponent:149

Selects the previous item

Returns : void
init
init(list: List)
Inherited from ListComponent
Defined in ListComponent:77
Parameters :
Name Type Optional
list List<T> No
Returns : void
ngOnChanges
ngOnChanges(changes?)
Inherited from ListComponent
Defined in ListComponent:68

Changing items or collection will trigger reconstructing the list with the new items. Changing the selection will reconstruct the selection

Parameters :
Name Optional
changes Yes
Returns : void
selectIndex
selectIndex(index: number)
Inherited from ListComponent
Defined in ListComponent:123

Selects the item with the given index

Parameters :
Name Type Optional
index number No
Returns : void
showHeader
showHeader()
Inherited from ListComponent
Defined in ListComponent:112

Decides if the header should be visible or not

Returns : any

Properties

Public cdr
Type : ChangeDetectorRef
Inherited from ResourceListComponent
Defined in ResourceListComponent:58
list
Type : ResourceList
Inherited from ResourceListComponent
Defined in ResourceListComponent:42

The instance of an EntryList

Public listConfig
Type : ListConfigService
Inherited from ResourceListComponent
Defined in ResourceListComponent:57
resourceConfig
Type : ResourceConfig
Inherited from ResourceListComponent
Defined in ResourceListComponent:34
Public route
Type : ActivatedRoute
Decorators :
@Optional()
Inherited from ResourceListComponent
Defined in ResourceListComponent:59
Public cdr
Type : ChangeDetectorRef
Inherited from ListComponent
Defined in ListComponent:64
config
Type : ListConfig<T>
Default value : {}
Inherited from ListComponent
Defined in ListComponent:33

The current list config

focusItem
Type : Item<T>
Inherited from ListComponent
Defined in ListComponent:60

Current focus

isLoading
Default value : false
Inherited from ListComponent
Defined in ListComponent:36

Config input for List

Public listConfig
Type : ListConfigService
Inherited from ListComponent
Defined in ListComponent:64 
import { Component, OnInit } from '@angular/core';
import { ResourceListComponent } from '../resource-list/resource-list.component';

@Component({
  selector: 'ec-asset-list',
  templateUrl: './asset-list.component.html',
})
export class AssetListComponent extends ResourceListComponent implements OnInit {
  ngOnInit() {}
}

<div class="ec-list">
  <ec-list-header [list]="list" [selection]="selection" *ngIf="showHeader()"></ec-list-header>
  <div class="ec-list-body">
    <div class="ec-list-group" *ngFor="let group of list?.groups">
      <div class="ec-list-group-header" *ngIf="group.value">
        <!--  (click)="selection?.toggleAll(listItems?.items)" -->
        <div class="ec-list-cell ec-list-item__selector" *ngIf="list?.config?.selectMode">
          <input type="checkbox" /><!--  [checked]="selection?.hasAll(listItems?.items)" -->
        </div>
        <div class="ec-list-cell">
          <span class="ec-list-group-header__title">{{ group.value }}</span>
        </div>
      </div>
      <!-- <ec-list-items [list]="list" [selection]="selection" (columnClicked)="columnClick($event)" #listItems [items]="list?.page | group: group.property: group.value"></ec-list-items> -->

      <!-- TODO -->
      <!-- <div *ngFor="let item of (list?.page?.items||[]);trackBy:list?.trackItem" (click)="columnClick(item,$event)"
                [class.is-selected]="selection?.has(item)">
                <div class="ec-list-cell ec-list-item__selector" *ngIf="list?.config?.selectMode">
                    <input type="checkbox" [checked]="selection?.has(item)">
                </div>
                {{item.getBody()}}
            </div> -->
    </div>
  </div>
</div>
<ec-pagination
  [hidden]="list?.config?.hidePagination"
  [config]="paginationConfig"
  [pagination]="list?.pagination"
></ec-pagination>
Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""