各位开发人员,大家好!
我正在使用angular slickgrid库,并尝试添加所提供的rowDetailView功能。
我的问题是,我可以单击展开视图,但不能关闭视图。只要我再次单击该符号以关闭/打开rowDetailView,我就会得到以下错误:
ERROR
core.js:15723
TypeError: Cannot read property 'hostView' of undefined
core.js:15723
message:"Cannot read property 'hostView' of undefined"
stack:"TypeError: Cannot read property 'hostView' of undefined
at RowDetailViewExtension.push../node_modules/angular-slickgrid/fesm5/angular-slickgrid.js.RowDetailViewExtension.onBeforeRowDetailToggle (http://localhost:4200/vendor.js:169190:48)
at RowDetailView.<anonymous> (http://localhost:4200/vendor.js:169026:27)
at Event.notify (http://localhost:4200/vendor.js:357049:35)
at SlickGrid.handleClick (http://localhost:4200/vendor.js:355962:39)
at Event.notify (http://localhost:4200/vendor.js:357049:35)
at trigger (http://localhost:4200/vendor.js:361492:18)
at HTMLDivElement.handleClick (http://localhost:4200/vendor.js:363417:7)
at HTMLDivElement.dispatch (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.slim.min.js:2:42347)
at HTMLDivElement.push../node_modules/slickgrid/lib/jquery.event.drag-2.3.0.js.$event.dispatch (http://localhost:4200/vendor.js:351849:30)
at HTMLDivElement.v.handle (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.slim.min.js:2:40348)"这是我的gridOptions:
this.gridOptions = {
enableAutoResize: true,
enableSorting: true,
enableColumnReorder: false,
enableFiltering: true,
enablePagination: true,
enableAsyncPostRender: true,
asyncPostRenderDelay: 0,
rowHeight: 50,
enableCellMenu: true,
rowSelectionOptions: {
selectActiveRow: true,
},
enableRowDetailView: true,
datasetIdPropertyName: 'id',
rowDetailView: {
process: (item) => this.simulateServerAsyncCall(item),
loadOnce: true,
singleRowExpand: true,
useRowClick: false,
panelRows: this.detailViewRowCount,
preloadComponent: LoaderComponentComponent,
parent: this,
viewComponent: RowDetailViewComponent,
},
params: {
angularUtilService: this.angularUtilService,
}
};下面是我使用的simulateServerAsyncCall()方法:
simulateServerAsyncCall(item: any) {
console.log('this is the item passed to the stimFunc: ' + JSON.stringify(item));
return new Promise((resolve) => {
if (this.businessClients === undefined) {
console.log('this company has no sites');
this.rowView.siteDataToPass = null;
} else {
console.log('its seems there might be a sight hiding somewhere');
this.rowView.siteDataToPass = this.businessClients[item.tenantId].sites;
}
resolve(this.businessClients);
});
}如果需要我的前端,它在这里:
<div id="companiesGrid" class="col" style="margin-top:15px">
<angular-slickgrid appSlickgridTour gridId="compGridList" [columnDefinitions]="columnDefinitions"
[gridOptions]="gridOptions" [dataset]="dataset" (onAngularGridCreated)="angularGridReady($event)">
</angular-slickgrid>
</div>我就是搞不清楚是我漏掉了什么,还是有别的问题。
谢谢大家。
发布于 2020-06-18 15:30:41
你好,好的,我把它弄清楚了:
当你使用angularslickgrid,你添加了你的网格选项,当你添加rowDetailView的时候,其中一个需求就是拥有返回新promise的process方法。我真的搞不清楚,但后来我避开了演示程序,看到了他在演示程序中解析的新承诺,就是传递给在我的进程上触发的方法(simulateServerAsyncCall())的相同参数。
因此,对于以后的读者,如果你有同样的问题,请注意@ghiscoding所说的:将你的组件添加到你的app.module.ts中的两个declarations and entryComponents数组中。在你的组件上,你的angular-slickgrid在gridOptions下面:
`
enableRowDetailView: true,rowDetailView":{ .... .... process:(item) => this.yourMethod(item) //解析新的promise }
that method should return the same item that was passed to that method as the new promise :
yourMethod(item: any) {
return new Promise((resolve) => {
resolve(item);
});
}`
这就是我的工作原理,并让我的角度网格rowDetailView完美地工作。
https://stackoverflow.com/questions/62431451
复制相似问题