WjFlexGridDetail Class

File
wijmo.angular2.js
Module
wijmo/wijmo.angular2.grid.detail
Base Class
FlexGridDetailProvider
Show
   

Angular 2 directive for FlexGrid DetailRow templates.

The wj-flex-grid-detail directive must be specified on a <template> template element contained in a wj-flex-grid component.

The wj-flex-grid-detail directive is derived from the FlexGridDetailProvider class that maintains detail rows visibility, with detail rows content defined as an arbitrary HTML fragment within the directive tag. The fragment may contain Angular 2 bindings, components and directives. The row and item template variables can be used in Angular 2 bindings that refer to the detail row's parent Row and Row.dataItem objects.

Constructor

Properties

Methods

Constructor

constructor

constructor(grid: FlexGrid, options?: any): FlexGridDetailProvider

Initializes a new instance of the FlexGridDetailProvider class.

Parameters
Inherited From
FlexGridDetailProvider
Returns
FlexGridDetailProvider

Properties

createDetailCell

Gets or sets the callback function that creates detail cells.

The callback function takes a Row as a parameter and returns an HTML element representing the row details. For example:

// create detail cells for a given row
dp.createDetailCell = function (row) {
  var cell = document.createElement('div');
  var detailGrid = new wijmo.grid.FlexGrid(cell, {
    itemsSource: getProducts(row.dataItem.CategoryID),
    headersVisibility: wijmo.grid.HeadersVisibility.Column
  });
  return cell;
};
Inherited From
FlexGridDetailProvider
Type
Function

detailVisibilityMode

Gets or sets a value that determines when row details are displayed.

Inherited From
FlexGridDetailProvider
Type
DetailVisibilityMode

disposeDetailCell

Gets or sets the callback function that disposes of detail cells.

The callback function takes a Row as a parameter and disposes of any resources associated with the detail cell.

This function is optional. Use it in cases where the createDetailCell function allocates resources that are not automatically garbage-collected.

Inherited From
FlexGridDetailProvider
Type
Function

grid

Gets the FlexGrid that owns this FlexGridDetailProvider.

Inherited From
FlexGridDetailProvider
Type
FlexGrid

initialized

This event is triggered after the component has been initialized by Angular, that is all bound properties have been assigned and child components (if any) have been initialized.

Type
EventEmitter

isAnimated

Gets or sets a value that indicates whether to use animation when showing row details.

Inherited From
FlexGridDetailProvider
Type
boolean

isInitialized

Indicates whether the component has been initialized by Angular. Changes its value from false to true right before triggering the initialized event.

Type
boolean

maxHeight

Gets or sets the maximum height of the detail rows, in pixels.

Inherited From
FlexGridDetailProvider
Type
number

rowHasDetail

Gets or sets the callback function that determines whether a row has details.

The callback function takes a Row as a parameter and returns a boolean value that indicates whether the row has details. For example:

// remove details from items with odd CategoryID
dp.rowHasDetail = function (row) {
  return row.dataItem.CategoryID % 2 == 0;
};

Setting this property to null indicates all rows have details.

Inherited From
FlexGridDetailProvider
Type
Function

Methods

created

created(): void

If you create a custom component inherited from a Wijmo component, you can override this method and perform necessary initializations that you usually do in a class constructor. This method is called in the last line of a Wijmo component constructor and allows you to not declare your custom component's constructor at all, thus preventing you from a necessity to maintain constructor parameters and keep them in synch with Wijmo component's constructor parameters.

Returns
void

hideDetail

hideDetail(row?: any): void

Hides the detail row for a given row.

Parameters
Inherited From
FlexGridDetailProvider
Returns
void

isDetailAvailable

isDetailAvailable(row: any): boolean

Gets a value that determines if a row has details to show.

Parameters
Inherited From
FlexGridDetailProvider
Returns
boolean

isDetailVisible

isDetailVisible(row: any): boolean

Gets a value that determines if a row's details are visible.

Parameters
Inherited From
FlexGridDetailProvider
Returns
boolean

showDetail

showDetail(row: any, hideOthers?: boolean): void

Shows the detail row for a given row.

Parameters
Inherited From
FlexGridDetailProvider
Returns
void