angular slick grid complex object with nullable string

Question

I am using angular slickgrid

  { id: 'fullName', field: 'user.fullName', name: 'Agent Name', filterable: true, sortable: true, formatter: Formatters.complexObject },

Error shows only if fullname is nullable data from json exist i am getting below

EDIT:

ERROR TypeError: Cannot read property 'width' of null
    at getCanvasWidth (vendor.js:195836)
    at getViewportHeight (vendor.js:198686)
    at SlickGrid.resizeCanvas (vendor.js:198712)
    at ResizerService.resizeGridWithDimensions (vendor.js:94087)
    at ResizerService.resizeGridCallback (vendor.js:94061)
    at vendor.js:94053
    at timer (polyfills.js:13097)
    at ZoneDelegate.invokeTask (polyfills.js:10942)
    at Object.onInvokeTask (vendor.js:43226)
    at ZoneDelegate.invokeTask (polyfills.js:10941)
defaultErrorLogger @ core.js:6456
handleError @ core.js:6504
next @ core.js:29284
__tryOrUnsub @ Subscriber.js:183
next @ Subscriber.js:122
_next @ Subscriber.js:72
next @ Subscriber.js:49
next @ Subject.js:39
emit @ core.js:25946
(anonymous) @ core.js:28703
invoke @ zone.js:372
run @ zone.js:134
runOutsideAngular @ core.js:28576
onHandleError @ core.js:28703
handleError @ zone.js:376
runTask @ zone.js:181
invokeTask @ zone.js:487
ZoneTask.invoke @ zone.js:476
data.args.<computed> @ zone.js:2541
core.js:6456 ERROR TypeError: Cannot convert undefined or null to object
    at Function.entries (<anonymous>)
    at complexObjectFormatter (vendor.js:101862)
    at appendCellHtml (vendor.js:198432)
    at appendRowHtml (vendor.js:198386)
    at renderRows (vendor.js:199153)
    at render (vendor.js:199258)
    at resizeCanvas (vendor.js:198814)
    at updateRowCount (vendor.js:198910)
    at SlickGrid.invalidate (vendor.js:198490)
    at DataView.<anonymous> (vendor.js:103566)
defaultErrorLogger @ core.js:6456
core.js:6456 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'children' of null
TypeError: Cannot read property 'children' of null
    at ensureCellNodesInRowsCache (vendor.js:198967)
    at cleanUpAndRenderCells (vendor.js:199053)
    at render (vendor.js:199254)
    at SlickGrid.resizeCanvas (vendor.js:198814)
    at ResizerService.resizeGridWithDimensions (vendor.js:94087)
    at ResizerService.resizeGridCallback (vendor.js:94061)
    at vendor.js:94056
    at new ZoneAwarePromise (polyfills.js:11923)
    at ResizerService.resizeGrid (vendor.js:94048)
    at ResizerService.handleResizeGrid (vendor.js:93949)
    at resolvePromise (polyfills.js:11749)
    at new ZoneAwarePromise (polyfills.js:11926)
    at ResizerService.resizeGrid (vendor.js:94048)
    at ResizerService.handleResizeGrid (vendor.js:93949)
    at dispatch (scripts.js:5430)
    at $event.dispatch (scripts.js:11280)
    at $event.dispatch (vendor.js:187486)
    at elemData.handle (scripts.js:5234)
    at ZoneDelegate.invokeTask (polyfills.js:10942)
    at Object.onInvokeTask (vendor.js:43226)
defaultErrorLogger @ core.js:6456
core.js:6456 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'children' of null
TypeError: Cannot read property 'children' of null
    at ensureCellNodesInRowsCache (vendor.js:198967)
    at cleanUpAndRenderCells (vendor.js:199053)
    at render (vendor.js:199254)
    at SlickGrid.resizeCanvas (vendor.js:198814)
    at ResizerService.resizeGridWithDimensions (vendor.js:94087)
    at ResizerService.resizeGridCallback (vendor.js:94061)
    at vendor.js:94056
    at new ZoneAwarePromise (polyfills.js:11923)
    at ResizerService.resizeGrid (vendor.js:94048)
    at ResizerService.handleResizeGrid (vendor.js:93950)
    at resolvePromise (polyfills.js:11749)
    at new ZoneAwarePromise (polyfills.js:11926)
    at ResizerService.resizeGrid (vendor.js:94048)
    at ResizerService.handleResizeGrid (vendor.js:93950)
    at dispatch (scripts.js:5430)
    at $event.dispatch (scripts.js:11280)
    at $event.dispatch (vendor.js:187486)
    at elemData.handle (scripts.js:5234)
    at ZoneDelegate.invokeTask (polyfills.js:10942)
    at Object.onInvokeTask (vendor.js:43226)

Above error getting only for complex object with null data ..Pleas let me how to configure.
@gistcode i have added more error log..Please check,,Can you please provide how i can i convert cutom format for this use case

you could try this flag `cellValueCouldBeUndefined` from the grid option and see if that works, this should also help for the sorting. If that doesn't work you can create your own Custom Formatter OR contribute a fix but now I just released a new major version 3.0 and this code now exist in Slickgrid-Universal — ghiscoding, Jul 20 '21 at 12:56
you can try converting to the new version but the code will be the same, the `cellValueCouldBeUndefined` will result in the same thing in both version, I would suggest you try it before converting to the new version. I'm saying this because there a few steps to follow to migrate to the new version, you can see all about it in the [Release](https://github.com/ghiscoding/Angular-Slickgrid/releases) section. It might help also for you to click on the `complexObjectFormatter` and see exactly which line of the formatter throws the error bcoz line 18369 doesn't tell me anything in minified code — ghiscoding, Jul 20 '21 at 20:51
cellValueCouldBeUndefined didnot work...how to write custom format ? can u pls provide a link for how i can i do that..i have added moe error log in the question... — Glen, Jul 21 '21 at 01:13
You're showing a completely different error now which is unrelated to the ComplexObjectFormatter. Anyway here's the [Custom Formatter Wiki](https://github.com/ghiscoding/Angular-Slickgrid/wiki/Formatters#custom-formatter), and here's the link to the [ComplexObjectFormatter](https://github.com/ghiscoding/Angular-Slickgrid/blob/version2/src/app/modules/angular-slickgrid/formatters/complexObjectFormatter.ts) if you want to copy the code and modify it as a Custom Formatter — ghiscoding, Jul 21 '21 at 12:54

score 1 · Accepted Answer · edited Jul 27 '21 at 22:47

1

Please note that I'm the author of Angular-Slickgrid

That was a bug that I was able to replicate and I just pushed a PR fix to address the issue and also released a new patch version 2.30.5 (the fix will also be available in latest major version 3.x). Just update to version 2.30.5 and you should be good to go.

edited Jul 27 '21 at 22:47

halfer

19,824
17
99
186

answered Jul 21 '21 at 15:37

ghiscoding

12,308
6
69
112

Thank you very much dude..I will check .since morning I am trying ...but goto know that of in my case if user itself null then grid was populated...only user.fullname if null it throws error..any way thanks anks again for fixing – Glen Jul 21 '21 at 17:11

angular slick grid complex object with nullable string

1 Answers1