I am using Wijmo's wjFlexGridDetail
directive, and want to control which rows display a detail grid based on whether a "detailData" array in the component contains any matching data. The rowHasDetail
property takes a function that uses the outer grid's row as input and returns a boolean. I want to do something like this:
<ng-template wjFlexGridDetail let-item="item" [rowHasDetail]="hasDetail">
hasDetail (row): boolean {
return this.detailData.filter(item => item.ID === row.dataItem.ID).length > 0
} // detailData is undefined when I try this
but this doesn't work because this
in the scope of the function refers to the wjFlexGridDetail
object, which doesn't contain the data I'm trying to check against. I tried binding it as a data attribute:
<ng-template wjFlexGridDetail let-item="item" [rowHasDetail]="hasDetail" [attr.data-detail]="detailData">
but got an error:
Uncaught (in promise): Error: Template parse errors: Property binding data-detail not used by any directive on an embedded template. Make sure that the property name is spelled correctly and all directives are listed in the "@NgModule.declarations".
Is there another way to get that data into the scope of the function? Or specifically for the wjFlexGridDetail
usage, is there another way to accomplish my goal (I want it to only display the + expansion button for rows that have detail data)?
I found a solution, but it feels like bad Angular so hopefully there's still a better answer out there.
The bind
function can add any data to the scope of the function. Instead of passing in the function directly, call a function that returns the function and bind the data to it.
<ng-template wjFlexGridDetail let-item="item" [rowHasDetail]="hasDetail()"><!-- note the () -->
hasDetail (): (row) => boolean {
return function (row): boolean {
return this && this.filter(item => item.ID === row.dataItem.ID).length > 0
}.bind(this.detailData)
}
Changing the scope of the function to detailData
allows the comparison to be made, but it really doesn't feel like the "correct" way of doing things.