在AngularJS中,我能够通过执行类似`gridOptions.api.setRowData(rowData)的操作来更新网格的行数据。
我现在正试图在Angular4应用程序中执行此操作。我的TS文件有:
import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { AgGridModule } from 'ag-grid-angular/main';
import { GridOptions, RowNode } from 'ag-grid/main';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app a4';
studentList = {};
gridOptions = {};
constructor(private http: HttpClient){
this.gridOptions = <GridOptions>{
context: {
componentParent: this
},
columnDefs: this.createColumnDefs(),
rowDefs: this.studentList,
};
}
ngOnInit(): void {
this.http.get('students/list').subscribe(data => {
this.studentList = data;
console.log(data);
this.gridOptions.api.setRowData(this.studentList);
});
}
private createColumnDefs() {
return [
{
headerName: "Name",
field: "name",
width: 400
},
{
headerName: "SSN",
field: "ssn",
width: 400,
}
];
}
}
但是,在编译时,angular-cli不喜欢`api。根据AG-Grid文档,这似乎仍然是正确的做事方式。我不能从实例中看出我所缺少的东西。
ERROR in C:/Projects/spring-boot-mvc-test/frontend/src/app/app.component.ts (31,25): Property 'api' does not exist on type '{}'.
答案 0 :(得分:0)
ngOnInit中的gridOptions似乎是空的。 试试这个:
ngOnInit(): void {
let that: this = this;
this.http.get('students/list').subscribe(data => {
this.studentList = data;
console.log(data);
that.gridOptions.api.setRowData(this.studentList);
});
}