Pivot Data Selector provides means to configure the pivot state of the Pivot Grid via a vertical panel UI
Igx Module
IgxPivotGridModule
Igx Theme
pivot-data-selector-theme
Igx Keywords
data selector, pivot, grid
Igx Group
Grids & Lists

Remarks

[object Object]

Example

<igx-pivot-grid #grid1 [data]="data" [pivotConfiguration]="configuration">
</igx-pivot-grid>
<igx-pivot-data-selector [grid]="grid1"></igx-pivot-data-selector>

Constructors

Section titled "Constructors"

IgxPivotDataSelectorComponent

new IgxPivotDataSelectorComponent(): IgxPivotDataSelectorComponent

Returns IgxPivotDataSelectorComponent

Properties

Section titled "Properties"

animationSettings

Section titled "animationSettings" 
animationSettings: object

Defined in projects/igniteui-angular/grids/pivot-grid/src/pivot-data-selector.component.ts:215

columnsExpanded

Section titled "columnsExpanded"

Gets/sets whether the columns panel is expanded Get

const columnsPanelState: boolean = this.dataSelector.columnsExpanded;

Set

<igx-pivot-data-selector [grid]="grid1" [columnsExpanded]="columnsPanelState"></igx-pivot-data-selector>

Two-way data binding:

<igx-pivot-data-selector [grid]="grid1" [(columnsExpanded)]="columnsPanelState"></igx-pivot-data-selector>
columnsExpanded: boolean = true

Defined in projects/igniteui-angular/grids/pivot-grid/src/pivot-data-selector.component.ts:78

columnsExpandedChange

Section titled "columnsExpandedChange"

Emitted when the columns panel is expanded or collapsed.

 
columnsExpandedChange: EventEmitter<boolean>

Defined in projects/igniteui-angular/grids/pivot-grid/src/pivot-data-selector.component.ts:90

Example

<igx-pivot-data-selector #grid [data]="localData" [height]="'305px'"
             (columnsExpandedChange)="columnsExpandedChange($event)"></igx-pivot-data-selector>

filtersExpanded

Section titled "filtersExpanded"

Gets/sets whether the filters panel is expanded Get

const filtersPanelState: boolean = this.dataSelector.filtersExpanded;

Set

<igx-pivot-data-selector [grid]="grid1" [filtersExpanded]="filtersPanelState"></igx-pivot-data-selector>

Two-way data binding:

<igx-pivot-data-selector [grid]="grid1" [(filtersExpanded)]="filtersPanelState"></igx-pivot-data-selector>
filtersExpanded: boolean = true

Defined in projects/igniteui-angular/grids/pivot-grid/src/pivot-data-selector.component.ts:140

filtersExpandedChange

Section titled "filtersExpandedChange"

Emitted when the filters panel is expanded or collapsed.

 
filtersExpandedChange: EventEmitter<boolean>

Defined in projects/igniteui-angular/grids/pivot-grid/src/pivot-data-selector.component.ts:152

Example

<igx-pivot-data-selector #grid [data]="localData" [height]="'305px'"
             (filtersExpandedChange)="filtersExpandedChange($event)"></igx-pivot-data-selector>

rowsExpanded

Section titled "rowsExpanded"

Gets/sets whether the rows panel is expanded Get

const rowsPanelState: boolean = this.dataSelector.rowsExpanded;

Set

<igx-pivot-data-selector [grid]="grid1" [rowsExpanded]="rowsPanelState"></igx-pivot-data-selector>

Two-way data binding:

<igx-pivot-data-selector [grid]="grid1" [(rowsExpanded)]="rowsPanelState"></igx-pivot-data-selector>
rowsExpanded: boolean = true

Defined in projects/igniteui-angular/grids/pivot-grid/src/pivot-data-selector.component.ts:109

rowsExpandedChange

Section titled "rowsExpandedChange"

Emitted when the rows panel is expanded or collapsed.

 
rowsExpandedChange: EventEmitter<boolean>

Defined in projects/igniteui-angular/grids/pivot-grid/src/pivot-data-selector.component.ts:121

Example

<igx-pivot-data-selector #grid [data]="localData" [height]="'305px'"
             (rowsExpandedChange)="rowsExpandedChange($event)"></igx-pivot-data-selector>

valuesExpanded

Section titled "valuesExpanded"

Gets/sets whether the values panel is expanded Get

const valuesPanelState: boolean = this.dataSelector.valuesExpanded;

Set

<igx-pivot-data-selector [grid]="grid1" [valuesExpanded]="valuesPanelState"></igx-pivot-data-selector>

Two-way data binding:

<igx-pivot-data-selector [grid]="grid1" [(valuesExpanded)]="valuesPanelState"></igx-pivot-data-selector>
valuesExpanded: boolean = true

Defined in projects/igniteui-angular/grids/pivot-grid/src/pivot-data-selector.component.ts:171

valuesExpandedChange

Section titled "valuesExpandedChange"

Emitted when the values panel is expanded or collapsed.

 
valuesExpandedChange: EventEmitter<boolean>

Defined in projects/igniteui-angular/grids/pivot-grid/src/pivot-data-selector.component.ts:183

Example

<igx-pivot-data-selector #grid [data]="localData" [height]="'305px'"
             (valuesExpandedChange)="valuesExpandedChange($event)"></igx-pivot-data-selector>

grid

Section titled "grid" 
grid: PivotGridType

Defined in projects/igniteui-angular/grids/pivot-grid/src/pivot-data-selector.component.ts:303, projects/igniteui-angular/grids/pivot-grid/src/pivot-data-selector.component.ts:311