Sets/gets whether the right panning of an item is allowed.
Default value is false.
<igx-list [allowRightPanning] = "true"></igx-list>
let isRightPanningAllowed = this.list.allowRightPanning;
Returns a collection of all items and headers in the list.
let listChildren: QueryList = this.list.children;
Returns the template which will be used by the IgxList in case there are no list items defined and isLoading is set to true.
let loadingTemplate = this.list.dataLoadingTemplate;
Returns the template which will be used by the IgxList in case there are no list items defined and isLoading is set to false.
let emptyTemplate = this.list.emptyListTemplate;
Sets/gets the id of the list.
If not set, the id of the first list component will be "igx-list-0".
<igx-list id = "my-first-list"></igx-list>
let listId = this.list.id;
Sets/gets whether the list is currently loading data.
Set it to display the dataLoadingTemplate while data is being retrieved.
Default value is false.
<igx-list [isLoading]="true"></igx-list>
let isLoading = this.list.isLoading;
Sets/gets the template shown when left panning a list item.
Default value is null.
<igx-list [allowLeftPanning] = "true"></igx-list>
let itemLeftPanTmpl = this.list.listItemLeftPanningTemplate;
Sets/gets the template shown when right panning a list item.
Default value is null.
<igx-list [allowLeftPanning] = "true"></igx-list>
let itemRightPanTmpl = this.list.listItemRightPanningTemplate;
Emits an event within the current list when a list item has been clicked.
Provides references to the IgxListItemComponent and Event as event arguments.
<igx-list (onItemClicked) = "onItemClicked($event)"></igx-list>
Emits an event within the current list when left pan gesture is executed on a list item.
Provides a reference to an object of type IListItemPanningEventArgs as an event argument.
<igx-list [allowLeftPanning]="true" (onLeftPan)="onLeftPan($event)"></igx-list>
Emits an event within the current list when pan gesture is executed on list item.
Provides references to the IgxListItemComponent and IgxListPanState as event arguments.
<igx-list (onPanStateChange) = "onPanStateChange($event)"></igx-list>
Emits an event within the current list when right pan gesture is executed on a list item.
Provides a reference to an object of type IListItemPanningEventArgs as an event argument.
<igx-list [allowRightPanning]="true" (onRightPan)="onRightPan($event)"></igx-list>
Provides a threshold after which the item's panning will be completed automatically. By default this property is set to 0.5 which is 50% of the list item's width.
this.list.panEndTriggeringThreshold = 0.8;
Returns the context object which represents the template context binding into the list container
by providing the $implicit declaration which is the IgxListComponent itself.
let listComponent = this.list.context;
Returns the theme of the component.
The default theme is comfortable.
Available options are comfortable, cosy, compact.
let componentTheme = this.component.displayDensity;
Sets the theme of the component.
Returns the headers in the list.
let listHeaders: IgxListItemComponent[] = this.list.headers;
Returns boolean indicating if the list is empty.
let isEmpty = this.list.isListEmpty;
Returns the items in the list excluding the headers.
let listItems: IgxListItemComponent[] = this.list.items;
Gets the role attribute.
let listRole = this.list.role;
Returns the template of an empty list.
let listTemplate = this.list.template;
Sets/gets whether the left panning of an item is allowed. Default value is
false.<igx-list [allowLeftPanning] = "true"></igx-list>let isLeftPanningAllowed = this.list.allowLeftPanning;IgxListComponent