首页 > 解决方案 > 角度数据网格(ag-grid)侧边栏不起作用

问题描述

数据-grid.component.html

<ag-grid-angular  style="width: 100%; height: 500px;" [sideBar]='true' [ngClass]="isEditable ? 'edit-table' : 'table'" class="ag-theme-balham"  [gridOptions]="gridOptions" [frameworkComponents]="frameworkComponents"  (gridReady)="onGridReady($event)">

data-grid.component.ts 从“@angular/common/http”导入 { HttpClient };

import 'ag-grid-enterprise';
import { PropertyKeys } from "ag-grid/dist/lib/propertyKeys";
import { ColDefUtil } from "ag-grid/dist/lib/components/colDefUtil";
// fix wrong property warning
PropertyKeys.ALL_PROPERTIES.push("__ob__");
ColDefUtil.ALL_PROPERTIES.push("__ob__");

请检查以下错误。

模板解析错误:无法绑定到“sideBar”,因为它不是“ag-grid-angular”的已知属性。1. 如果 'ag-grid-angular' 是一个 Angular 组件并且它有 'sideBar' 输入,那么验证它是这个模块的一部分。2. 如果“ag-grid-angular”是一个 Web 组件,则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“@NgModule.schemas”以禁止显示此消息。3. 允许任何属性将“NO_ERRORS_SCHEMA”添加到该组件的“@NgModule.schemas”。(" style="margin-bottom: 10px;"> ][sideBar]='true' [ngClass]="isEditable ? 'edit-table' : 'table'" class="ag-theme-balham" [gridOption" ): ng:///AppModule/DataGridComponent.html@34:58 at syntaxError (compiler.js:486)

标签: angular

解决方案


正如错误所说,网格无法识别此属性(sideBar),这是因为您使用的是旧版本的 ag-grid(<19)。

对于旧版本,您应该使用“showToolPanel”而不是“sideBar”。

您可以阅读19.0.0 版的 ag-grid 更改日志

还要注意这一点(如他们所述):

“ ag-Grid 的免费模块的 NPM 包名称现在是 ag-grid-community 而不是 ag-grid。这意味着您使用 npm install ag-grid-community 安装,然后引用 import {Grid, GridOptions} from “ag-grid-community”。


推荐阅读