Open Qualaelay opened 6 years ago
Having the same issue
Was this ever fixed, this is such a silly problem and has consummed of a lot of time from devs trying to debug.
It is not actually a bug, you just use it incorrectly. We had exactly the same problem.
The answer sits here: https://github.com/swimlane/ngx-datatable/blob/5eed8493fa016bcbf49f7fe7d9bc39e41916a4e7/docs/api/column/inputs.md?plain=1#L9
The column model has a name
property and prop
property. prop
is used to get the value to display. name
has a different purpose. But if you do not specify prop
, the lib tries to do you a favour and figure it out from the name
property by camel casing it.
So instead of setting the name
for the column, you should set prop
. Your blitz can be fixed easily by changing this line:
<ngx-datatable-column name="{{col.prop}}" *ngIf="col.display"
to this:
<ngx-datatable-column prop="{{col.prop}}" *ngIf="col.display"
in your app.component.html file.
I'm submitting a ... (check one with "x")
Current behavior If we use a ngx-datatable-column to specify definition of columns (and take actions accordingly, such as display a column based on a property), then values from ngx-datatable-cell-template need to be camelCase. I couldn't find a way to have values bound to prop
Expected behavior I would expect that the JSON model can be non camelCase, in the stackblitz commentNONCAMEL values should appear as well
Reproduction of the problem I created a reproduction here: https://stackblitz.com/edit/angular-3fjfsb Values coming from the non camel-case property is not fetched (or I couldn't find a documented way/example)
What is the motivation / use case for changing the behavior? Business case where I need to use ngx-datatable-column to display certain columns, and where response from the backend does contain properties which are non camelCase (to be specific, "commentCRO")
Please tell us about your environment: Windows 10,
Table version: ngx-datatable 13.1.0
Angular version: Angular 5 (but stackblitz example is running on 6),
Browser: All
Language: [all | TypeScript X.X | ES6/7 | ES5] All