/*! * * Wijmo Library 5.20251.40 * https://developer.mescius.com/wijmo * * Copyright(c) MESCIUS inc. All rights reserved. * * Licensed under the End-User License Agreement For MESCIUS Wijmo Software. * us.sales@mescius.com * https://developer.mescius.com/wijmo/licensing * */ /** * {@module wijmo.knockout.grid} * KnockoutJS bindings for wijmo.grid module */ /** * */ export declare var ___keepComment: any; import { WjBinding, WjContext } from 'wijmo/wijmo.knockout.base'; /** * KnockoutJS binding for the {@link FlexGrid} control. * * Use the {@link wjFlexGrid} binding to add {@link FlexGrid} controls to your * KnockoutJS applications. For example: * *
<p>Here is a FlexGrid control:</p> * <div data-bind="wjFlexGrid: { itemsSource: data }"> * <div data-bind="wjFlexGridColumn: { * header: 'Country', * binding: 'country', * width: '*' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Date', * binding: 'date' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Revenue', * binding: 'amount', * format: 'n0' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Active', * binding: 'active' }"> * </div> * </div>* * The wjFlexGrid binding may contain {@link wjFlexGridColumn} child bindings. * * The wjFlexGrid binding supports all read-write properties and events of * the {@link FlexGrid} control, except for the scrollPosition, * selection and columnLayout properties. */ export declare class wjFlexGrid extends WjBinding { static _columnTemplateProp: string; static _cellClonedTemplateProp: string; static _cellVMProp: string; static _templColIdx: string; static _columnStyleBinding: string; static _columnStyleProp: string; _getControlConstructor(): any; _createWijmoContext(): WjContext; _initialize(): void; private _formatterPropHandler; } export declare class WjFlexGridContext extends WjContext { _wrapperFormatter: any; _userFormatter: Function; _initControl(): void; private _itemFormatter; } /** * KnockoutJS binding for the {@link FlexGrid} {@link Column} object. * * The {@link wjFlexGridColumn} binding must be contained in a {@link wjFlexGrid} binding. For example: * *
<p>Here is a FlexGrid control:</p> * <div data-bind="wjFlexGrid: { itemsSource: data }"> * <div data-bind="wjFlexGridColumn: { * header: 'Country', * binding: 'country', * width: '*' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Date', * binding: 'date' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Revenue', * binding: 'amount', * format: 'n0' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Active', * binding: 'active' }"> * </div> * </div>* * The wjFlexGridColumn binding supports all read-write properties and events of * the {@link Column} class. The isSelected property provides two-way binding mode. * * In addition to regular attributes that match properties in the Column class, * an element with the {@link wjFlexGridColumn} binding may contain a {@link wjStyle} binding that * provides conditional formatting and an HTML fragment that is used as a cell template. Grid * rows automatically stretch vertically to fit custom cell contents. * * Both the wjStyle binding and the HTML fragment can use the $item observable variable in * KnockoutJS bindings to refer to the item that is bound to the current row. Also available are the * $row and $col observable variables containing cell row and column indexes. For example: * *
<div data-bind="wjFlexGridColumn: { * header: 'Symbol', * binding: 'symbol', * readOnly: true, * width: '*' }"> * <a data-bind="attr: { * href: 'https://finance.yahoo.com/q?s=' + $item().symbol() }, * text: $item().symbol"> * </a> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Change', * binding: 'changePercent', * format: 'p2', * width: '*' * }, * wjStyle: { * color: getAmountColor($item().change) }"> * </div>* * These bindings create two columns. * The first has a template that produces a hyperlink based on the bound item's "symbol" property. * The second has a conditional style that renders values with a color determined by a function * implemented in the controller. */ export declare class wjFlexGridColumn extends WjBinding { _getControlConstructor(): any; _createControl(element: any): any; _createWijmoContext(): WjContext; } export declare class WjFlexGridColumnContext extends WjContext { _initControl(): void; } /** * KnockoutJS binding for conditional formatting of {@link FlexGrid} {@link Column} cells. * * Use the {@link wjStyle} binding together with the {@link wjFlexGridColumn} binding to provide * conditional formatting to column cells. * For example: * *
<div data-bind="wjFlexGridColumn: { * header: 'Change', * binding: 'changePercent', * format: 'p2', * width: '*' * }, * wjStyle: { color: getAmountColor($item().change) }"></div>* * * The wjStyle uses the same syntax as the native KnockoutJS * style binding. * In addition to the view model properties, the following observable variables are available in binding * expressions: * *