ui-grid: Grid not rendered correctly when using ng-show / ng-hide
Steps to reproduce:
- Create a grid
- Add the
ng-show
directive and tell the grid to only show when more than 0 items are available - Initialize your items with an empty array
- Fill in data to your items array at a later point in time (web service, timeout, …)
Expected result:
- The grid is initially hidden, and gets shown once the data are set.
Actual result:
- The grid is initially hidden, and stays hidden once the data are set.
Versions used:
- AngularJS 1.2.2
- ngGrid 2.0.7
About this issue
- Original URL
- State: closed
- Created 11 years ago
- Comments: 30
Encountered the same issue. Using ng-if instead of ng-show/ng-hide seems to correct the issue.
add ui-grid-auto-resize attribute to your ui grid will solve your problem. don’t use ng-if while ui grid got involved, that is really SLOW operation while your data is big.
good luck.
ng-if instead of ng-show/ng-hide worked for me
This is still an issue for me with ui-grid 4.0.7.
Doesn’t solve for me with angular 1.4.
The quickest option is to add ‘ui-grid-auto-resize’ in your dom element -
<div ui-grid="gridOptions" ui-grid-edit class="grid" ui-grid-auto-resize></div>
Thanks @pmacmillan, ng-if fixed the problem for me.