问题描述:在AgGrid的单元格渲染中,无法在init()函数中实例化服务类。
解决方法: 在AgGrid的单元格渲染中,可以通过使用Angular的依赖注入来解决这个问题。以下是一个示例:
import { Injectable } from '@angular/core';
@Injectable()
export class MyService {
constructor() {}
doSomething() {
console.log('Doing something');
}
}
import { Component } from '@angular/core';
import { ICellRendererAngularComp } from 'ag-grid-angular';
@Component({
selector: 'app-my-cell-renderer',
template: `{{ value }}`,
})
export class MyCellRendererComponent implements ICellRendererAngularComp {
value: string;
constructor(private myService: MyService) {}
agInit(params: any): void {
this.value = params.value;
}
refresh(params: any): boolean {
return false;
}
}
import { NgModule } from '@angular/core';
import { AgGridModule } from 'ag-grid-angular';
import { MyCellRendererComponent } from './my-cell-renderer.component';
import { MyService } from './my-service.service';
@NgModule({
declarations: [MyCellRendererComponent],
imports: [AgGridModule.withComponents([MyCellRendererComponent])],
providers: [MyService],
})
export class MyModule {}
import { Component } from '@angular/core';
import { MyCellRendererComponent } from './my-cell-renderer.component';
@Component({
selector: 'app-root',
template: `
`,
})
export class AppComponent {
rowData = [
{ value: 'Value 1' },
{ value: 'Value 2' },
{ value: 'Value 3' },
];
columnDefs = [
{
headerName: 'Value',
field: 'value',
cellRenderer: 'myCellRenderer',
},
];
frameworkComponents = {
myCellRenderer: MyCellRendererComponent,
};
}
通过以上步骤,你就可以在MyCellRendererComponent中成功使用MyService。在MyCellRendererComponent的构造函数中注入MyService,并在其中调用服务类的方法。
注意:确保在模块中将MyCellRendererComponent添加到declarations和entryComponents中,并将MyService添加到providers中,以便正确地使用它们。