@@ -906,6 +906,30 @@ describe('IgxHierarchicalGrid Template Changing Scenarios', () => {
906
906
expect ( child2Headers [ 2 ] . nativeElement . innerText ) . toEqual ( 'Col1' ) ;
907
907
} ) ;
908
908
909
+ it ( 'should render correct columns when setting columns for parent and child post init using ngFor' , ( ) => {
910
+ const row = hierarchicalGrid . getRowByIndex ( 0 ) as IgxHierarchicalRowComponent ;
911
+ UIInteractions . clickElement ( row . expander ) ;
912
+ fixture . detectChanges ( ) ;
913
+
914
+ const child1Grids = fixture . debugElement . queryAll ( By . css ( 'igx-child-grid-row' ) ) ;
915
+ const child1Grid = child1Grids [ 0 ] . query ( By . css ( 'igx-hierarchical-grid' ) ) . componentInstance ;
916
+
917
+ fixture . componentInstance . parentCols = [ 'Col1' , 'Col2' ] ;
918
+ fixture . componentInstance . islandCols1 = [ 'ID' , 'ProductName' , 'Col1' ] ;
919
+ fixture . detectChanges ( ) ;
920
+ // check parent cols
921
+ expect ( hierarchicalGrid . columns . length ) . toBe ( 4 ) ;
922
+ expect ( hierarchicalGrid . columns [ 0 ] . field ) . toBe ( 'ID' ) ;
923
+ expect ( hierarchicalGrid . columns [ 1 ] . field ) . toBe ( 'ProductName' ) ;
924
+ expect ( hierarchicalGrid . columns [ 2 ] . field ) . toBe ( 'Col1' ) ;
925
+ expect ( hierarchicalGrid . columns [ 3 ] . field ) . toBe ( 'Col2' ) ;
926
+ // check child cols
927
+ expect ( child1Grid . columns . length ) . toBe ( 3 ) ;
928
+ expect ( hierarchicalGrid . columns [ 0 ] . field ) . toBe ( 'ID' ) ;
929
+ expect ( hierarchicalGrid . columns [ 1 ] . field ) . toBe ( 'ProductName' ) ;
930
+ expect ( hierarchicalGrid . columns [ 2 ] . field ) . toBe ( 'Col1' ) ;
931
+ } ) ;
932
+
909
933
it ( 'should update columns for expanded child when adding column to row island' , ( ) => {
910
934
const row = hierarchicalGrid . getRowByIndex ( 0 ) as IgxHierarchicalRowComponent ;
911
935
UIInteractions . clickElement ( row . expander ) ;
@@ -1206,6 +1230,7 @@ export class IgxHGridRemoteOnDemandComponent {
1206
1230
<igx-hierarchical-grid #hierarchicalGrid [data]="data" [autoGenerate]="false" [height]="'500px'" [width]="'800px'" >
1207
1231
<igx-column field="ID"></igx-column>
1208
1232
<igx-column field="ProductName"></igx-column>
1233
+ <igx-column *ngFor="let colField of parentCols" [field]="colField"></igx-column>
1209
1234
<igx-row-island [key]="'childData'" [autoGenerate]="false" #rowIsland [height]="'350px'">
1210
1235
<igx-column *ngFor="let colField of islandCols1" [field]="colField"></igx-column>
1211
1236
<igx-row-island [key]="'childData'" [autoGenerate]="false" #rowIsland2 [height]="'200px'">
@@ -1217,6 +1242,7 @@ export class IgxHGridRemoteOnDemandComponent {
1217
1242
export class IgxHierarchicalGridColumnsUpdateComponent extends IgxHierarchicalGridTestBaseComponent implements AfterViewInit {
1218
1243
public cols1 = [ 'ID' , 'ProductName' , 'Col1' , 'Col2' , 'Col3' ] ;
1219
1244
public cols2 = [ 'ID' , 'ProductName' , 'Col1' ] ;
1245
+ public parentCols = [ ] ;
1220
1246
public islandCols1 = [ ] ;
1221
1247
public islandCols2 = [ ] ;
1222
1248
constructor ( public cdr : ChangeDetectorRef ) {
0 commit comments