There are some non-isolated parts of the code-snippet, that prevent me from identifying what exactly is going on and where binding the child grid data is performed. For instance, the this.getChildData code is missing. Nevertheless, I have created this sample, which updates the expanded row’s "Orders" child grid data. It does this in the rowToggle handler, and as you can see, the data is updated with each expansion.

As you are already familiar form our previous discussions:

1. The initial binding of a child grid data has to happen in the gridCreated event for load on demand scenarios. It is only triggered once initially.
2. You are free to update the grid data whenever required after that, including the rowToggle event. However, additional checks should be made to ensure that the target grid, is created. This is because the rowToggle event is triggered before the gridCreated when expanding the parent row for the first time.

  public rowToggle(event: IRowToggleEventArgs, parentKey: string) {
    console.log('row toggle');
    if (!event.expanded) {
      return;
    }

    const childGrids = this.hGrid.gridAPI.getChildGridsForRowIsland('Orders');
    if (childGrids.length == 0) {
      return;
    }
    const grid = this.hGrid.gridAPI.getChildGridByID('Orders', event.rowID);
    if (!grid) {
      return;
    }

    const dataState: IDataState = {
      key: 'Orders',
      parentID: event.rowID,
      parentKey: parentKey,
      rootLevel: false,
    };

    this.loadTargetGridData(dataState, grid as IgxHierarchicalGridComponent);
  }

The StackBlitz sample I prepared achieves reloading child grid data on each expansion of a parent row, for the “Orders” row island. The below gif demonstrates this:

Please, check out the sample. I have also included some console logs to help understand the sequence of the events and data assignment operations.

Finally, please, note that since version 9.x is not supported, we cannot provide samples with it according to our Support Policy. We strongly encourage you to upgrade, which comes with the advantage of leveraging all new features and fixes introduced since version 9. The most recent release is 16.0.

Best regards,
Bozhidara Pachilova
Associate Software Developer

Eventhough i am calling the api on expanding i am unable to bind to child grid using rowToggle() method.