Telerik Kendo Angular Grid UI Issue with nested Grid

Question

Kendo Angular grid is working fine with parent and nested grid for angular version 7.2. However when I update to Angular version 12.2.11 it is not rendering nested grid.

After debugging I noticed that data is appropriate. Below is the code I am using.

 <section *ngIf != "this._dataSourceService.formData.dataAnalysisSettings.isDisplayNestedData">
    <ng-template kendoGridCellTemplate let-dataItem let-rowIndex="rowIndex">
      <app-nested-column-data [webpartId]="this.webpartid" [parentItemValue]="dataItem"
        [isDocLib]="this._dataSourceService.formData.dataAnalysisSettings.nestedDataSettings.isNestedListDocLib"
        [parentColumnName]="this.parentSourceColumnName"
        [enableExportNestedDataToExcel]="this._dataSourceService.tempFormData.generalSettings.enableExportNestedDataToExcel"
        [typeOfExportItems]="this.typeOfExportItem"
        [nestedConditionalFormattingRules]="this._dataSourceService.formData.dataAnalysisSettings.coditionalFormatting.nestedListFormattingRules"
        [nestedCalculationFormattingRules]="this._dataSourceService.formData.dataAnalysisSettings.calculationFormatting.nestedListFormattingRules"
        [nestedListId]="this._dataSourceService.formData.dataAnalysisSettings.nestedDataSettings.nestedListId"
        [nestedColumnId]="this._dataSourceService.formData.dataAnalysisSettings.nestedDataSettings.nestedMapColumn">
      </app-nested-column-data>
    </ng-template>
  </section>

Note: Condition is satisfied.

Thanks in advance.