3
我想在ag-grid单元格中使用路由。我已经尝试过各种解决方案，比如在gridOption中添加“angularCompileRows：true”，我给了同样的超时时间，但都没有工作。它给'不能读取属性'$ apply'未定义'的错误。添加“angularcompileRows：true”后，Ag-grid单元格不会编译事件
我的maincomponent.ts文件。
private gridOptions: GridOptions;
public showGrid: boolean;
private columnDefs: any[];
public rowCount: string;
properties: ViewPropertyModel[] = [];
ngAfterViewChecked() {
this.gridOptions.api.sizeColumnsToFit();
}
ngOnInit() {
this.gridOptions = <GridOptions>{
enableColResize: true,
enableSorting: true,
enableFilter: true,
rowModelType: "pagination",
paginationPageSize: 10,
angularCompileRows: true
};
this.createColumnDefs();
this.getProperties();
}
constructor(
public router: Router,
private service: SharedContents,
private _propertyServices: PropertyServices) {
this.service.setData('page-wrapper', true);
}
getProperties() {
this._propertyServices.getPropertyList()
.subscribe(properties => {
var self = this;
if (properties.status == "success") {
this.properties = properties.data;
let dataSource = {
propertyList: this.properties,
rowCount: this.properties.length,
getRows: function (params: any) {
var lastRow = -1;
var pageRows = this.propertyList.slice(params.startRow, params.endRow);
if (this.propertyList.length <= params.endRow)
lastRow = this.propertyList.length;
params.successCallback(pageRows, lastRow);
}
}
this.gridOptions.api.setDatasource(dataSource);
}
});
}
createColumnDefs() {
this.columnDefs = [
{ headerName: "Property Name", field: "property_name" },
{
headerName: "Actions", field: "status",
cellRenderer: function (params) {
return "<a [routerLink]='['../editproperty']' title='Edit Property'><i class='md-icon fa fa-edit'></i></a>" +
"<a (click)='openArchiveModal()' title= 'Delete' > <i class='md-icon fa fa-trash' > </i></a>";
}
}
];
}
HTML页面。
<ag-grid-ng2 #agGrid style="width: 100%; height: 450px;" class="ag-bootstrap"
[gridOptions]="gridOptions"
[columnDefs]="columnDefs"
enableColResize
enableSorting
enableFilter
toolPanelSuppressGroups
toolPanelSuppressValues
debug
rowHeight="35">
</ag-grid-ng2>