Posted 12 January 2023, 9:59 pm EST
Hi
I was wondering if there was a way to hook into the Group Heading Format event to add our own calls / data based on the value about to be rendered?
For example: my groupHeaderFormat would be something like this:
groupHeaderFormat=“{{ RenderHeading(‘{value}’}}”
then in my .ts file I could have something like:
private DataArray = [
{name: xxx, id: 1},
{name: yyy, id: 2}
]
public RenderHeading(value: string): string{
const selectedItem = DataArray.find((item) => item.name == value);
return `${selectedItem.Id} - ${value}`;
}
This would then render two headers as
1 - xxx
2 - yyy
The problem at the moment is, angular seems to render before the header tags are replaced so instead of {value} being replaced with xxx / yyy and those values being passed to the function, the tag {value} is passed to the function twice instead.
