我正在尝试使用角度Ag-Grid https://www.ag-grid.com/在我的网络应用程序中。
我已经遵循了这些教程
角网格|开始使用 ag-Grid https://www.ag-grid.com/angular-getting-started/
ag-Grid 角度组件 https://www.npmjs.com/package/ag-grid-angular
Problem / Issue
I Follwed every thing exactly. Even data is being loaded in grid but View is not very appreciable. Here what I'm getting (not alignment, no coloring)
我尝试过的我通过 Google 和 Stack Overflow 进行了广泛的搜索。一些答案建议CSS
没有正确加载(这是可靠的论据),但我仔细检查了我的导入语句Component.css
并且还尝试添加.css
参考文献index.html
. The .css
我引用的文件是存在的,参考也很好。
我的期望
Codes
应用程序组件.html
<ag-grid-angular style="width: 500px; height: 500px;" class="ag-theme-balham" [rowData]="rowData"
[columnDefs]="columnDefs">
</ag-grid-angular>
应用程序组件.ts
import { Component } from '@angular/core';
import { Grid } from 'ag-grid/main';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
title = 'Grid1';
columnDefs = [
{ headerName: "Make", field: "make" },
{ headerName: "Model", field: "model" },
{ headerName: "Price", field: "price" },
];
rowData = [
{ make: "Toyota", model: "m1", price: 35351 },
{ make: "Ford", model: "m2", price: 6546 },
{ make: "M3", model: "m3", price: 646 },
{ make: "M765", model: "m4", price: 56486 }
]
}
应用程序组件.scss
@import "~ag-grid/dist/styles/ag-grid.css";
@import "~ag-grid/dist/styles/ag-theme-balham.css";
我还尝试了其他教程,其中提到了这一点app.component.scss
@import "~ag-grid-community/dist/styles/ag-grid.css";
@import "~ag-grid-community/dist/styles/ag-theme-balham.css";