我尝试按照字母ag-grid-aurelia-example的例子进行操作,但是在用户向我的自定义单元格编辑器中输入值后,它从未将用户输入的值放入其单元格中,并且控制台日志显示了即使我的单元格编辑器类具有getValue()
方法,也会出现以下警告:
ag-Grid: Framework component is missing the method getValue()
我缺少明显的东西吗?我无法构建示例,因此甚至不确定它是否也可以。
相关查看代码:
<ag-grid-aurelia #agGrid class="ag-theme-balham-dark ap-form-grid"
// items bound to properties on the controller
grid-options.bind="gridOptions"
row-data.bind="lines"
// boolean values 'turned on'
enable-range-selection
enable-col-resize
enter-moves-down-after-edit
// simple values
row-height.bind="22"
row-selection="multiple"
// event handlers
grid-ready.call="onReady($event)"
cell-value-changed.call="onColumnEvent($event)"
cell-clicked.call="onCellClicked($event)">
<ag-grid-column header-name="COA Code" field="CoaCode" editable.bind="!$this.readOnly">
<ag-editor-template>
<autocomplete
if.bind="!readOnly"
placeholder=""
suggestion-service.bind="params.api.suggestionService"
field-name.bind="'COA Code'"
user-input.bind="params.node.CoaCode"
show-decode.bind="true"
decode-field-name.bind="'entityName'"
show-error.bind="true"
>
<template replace-part="suggestion">
<div class="suggestion-container">
<div class="suggestion-details">
<div class="suggestion-name">${suggestion.entityName} (${suggestion.entityCode}) (${suggestion.entityInactive ? "NOT ACTIVE" : "ACTIVE"})</div>
</div>
</div>
</template>
</autocomplete>
</ag-editor-template>
</ag-grid-column>
</ag-grid-aurelia>
相关单元格编辑器代码:
import { inject, customElement, bindable, bindingMode, observable } from
"aurelia-framework";
import "./autocomplete.scss";
export interface AutoCompleteSuggestionService<T> {
suggest(value: string, fieldName?: string): Promise<any>;
getDisplayText(suggestion: T): string;
getDecodedText(suggestion: T, decodeFieldName: T): string;
}
@customElement("autocomplete")
@inject(Element)
export class AutoComplete {
element: HTMLElement;
suggestions_box: HTMLElement;
constructor(element) {
this.element = element;
}
....
getValue(): any {
return this.inputValue;
}
....
}