So, I have modified a fork of the previously referenced StackBlitz to dynamically add columns to the grid, similar to your app.

In the isolated app, no errors are encountered and the newly added columns’ cells can be edited.

From the provided template files (cond.component.html, line 76), I can see that the cell templates contain complex markup, including an html table. Generally, this would not be quite advisable, as the cells’ purpose is to display data as simple as possible, and nesting tables within grid cells would not be considered the best layout.

Now, I cannot really test this for the reasons mentioned above, however, I can also see the cellEditEnter and cell click events are handled for the grid. Since they are directly related to entering cell edit mode, and I can see they contain some complex application logic (cond.component.ts, line 284, line 371), it is very likely that the errors are related to this functionality. The call stack does not indicate any Ignite UI for Angular code, so my suggestion is to check the code files and lines indicated by it, put some breakpoints and go deeper through the call stack via the Developer Tools in order to debug the source of the error.

Please, note that since the isolated sample does not demonstrate a similar issue, this indicates it is rooted in the application level and has to be investigated and handled on the same as well.

Since our policy involves working with isolated samples, I would still suggest forking and modifying the StackBlitz with only the relevant code and see if the issue can be reproduced there. Thank you for your cooperation.

Best regards,
Bozhidara Pachilova
Associate Software Developer

cond.zip

The file above contains the code I'm using.

<igx-grid [hideRowSelectors]="true" #grid1 [data]="rowData" [height]="null" primaryKey="title" displayDensity="compact" [clipboardOptions]="copyOptions" paste-handler
          (onDataProcessed)="dataPasted($event, grid1, 1)"
          (cellEditExit)="cellEditExit($event, 1)"
          (gridKeydown)="customKeydown($event, grid1)"
          (keydown)="handleKeyDownBoardEvent($event, grid1)"
          (keyup)="handleKeyUpBoardEvent($event, grid1)"
          (cellEditEnter)="cellEditEnter($event, rowData)"
          (cellClick)="checkClickFluidType($event)"
          (selected)="setCellSelection($event, grid1, 'onSelection')"
          (rangeSelected)="setCellSelection($event, grid1, 'onRangeSelection')"
          (activeNodeChange)="onActiveNodeChange($event, grid1)"
>
  <igx-column field="title" header="項目名" [width]="widthTitle" [pinned]="true" [headerClasses]="'text-center'" [cellClasses]="cellCls2">
  </igx-column>
  <igx-column *ngFor="let c of columns" [field]="'no'+c" [header]="'No.'+c" [width]="'130px'" [editable]="true" [headerClasses]="'text-center pd0'" [cellClasses]="cellClsDirtyCheck"></igx-column>
</igx-grid>

  addTab() {
    this.columns.push(this.columns.length + 1);
    this.rowData.map(row => {
      if (row.field === 'WITH_FIN_A' || row.field === 'WITH_FIN_B') {
        return row['no'+this.columns.length] = true;
      } else {
        return row['no'+this.columns.length] = '';
      }
    };
  }

related html and ts files.

First I have column number from no1->no16.

When I click "追加" button (add column) it generates no17.

Here I click to edit the data of column no17, I am getting the above error.

Note: Column no17 is being generated by the library after I push to add an element to the columns array.

Could you please elaborate on the configuration of your app? For example, can you please provide the described column’s template code, as well as its “dynamic” equivalent? Are these inputs part of the cell editing template? This information will be highly appreciated, so that I can have more context about your question and will be able to assist you.

What I can currently say is that the ng-relfect-*property* attributes are added for debugging purposes and show the input bindings that a component/directive has declared in its class. Having this in mind, is it possible that this binding is missing in the “dynamic” configuration?

Ideally, please, fork and modify the previously referenced sample with only the relevant code and send it back to me along with more details, to demonstrate your point.

Best regards,
Bozhidara Pachilova