我正在开发一个包含可编辑网格刀片的 Azure 门户扩展。网格的刀片从选择器打开,因此包含参数提供程序。
网格使用参数提供者的编辑范围进行初始化,这是一个可观察的数组,并启用了行编辑和插入新行。
当我尝试更新网格时,不会显示对现有行的更改,并且创建新行会产生一个空行,如下所示:
调试时我在控制台中看不到任何错误。
这是我初始化网格的方式:
private _initialize(container: MsPortalFx.ViewModels.PartContainerContract): void {
var extensions: number = MsPortalFx.ViewModels.Controls.Lists.Grid.Extensions.EditableRow | MsPortalFx.ViewModels.Controls.Lists.Grid.Extensions.ContextMenuShortcut,
extensionsOptions: MsPortalFx.ViewModels.Controls.Lists.Grid.ExtensionsOptions<DataModels.IItem, DataModels.ISelectionItem>,
viewModel: MsPortalFx.ViewModels.Controls.Lists.Grid.ViewModel<DataModels.IItem, DataModels.ISelectionItem>;
// Set up the editable extension options.
extensionsOptions = this._createExtensionsOptions();
// Create the grid view model.
viewModel = new MsPortalFx.ViewModels.Controls.Lists.Grid.ViewModel<DataModels.IItem, DataModels.ISelectionItem>(
container,
null,
extensions,
extensionsOptions);
viewModel.showHeader = true;
viewModel.columns(this._columns);
viewModel.rowAdd = () => {
// code that extension authors need to execute when a row is added should go here.
};
this.editableGrid = viewModel;
}
private _createExtensionsOptions(): MsPortalFx.ViewModels.Controls.Lists.Grid.ExtensionsOptions<DataModels.IItem, DataModels.ISelectionItem> {
return <MsPortalFx.ViewModels.Controls.Lists.Grid.ExtensionsOptions<DataModels.IItem, DataModels.ISelectionItem>>{
editableRow: {
// Supplies editable items to the grid.
editScope: this.parameterProvider.editScope,
// put the new row at the top.
placement: MsPortalFx.ViewModels.Controls.Lists.Grid.EditableRowPlacement.Bottom,
// Create no more than 5 new rows.
maxBufferedRows: 5,
// Allow the modification of existing items.
allowEditExistingItems: true,
// Allow the creation of new items.
allowEditCreatedItems: true,
// Track the valid status
valid: ko.observable<boolean>()
}
};
}
我已经查看了几个可编辑网格的示例刀片,但无法确定我做错了什么。