Hello,
We found a bug in the 4.0 beta 1 of the ArcGIS Api for JavaScript. When restricting the height of the map and placing a table below it that is long enough to create a vertical scrollbar, the tiles are not loading. But when you scroll to the bottom and scroll back, the map tiles are showing.
To demonstrate this I created a Plunker. Open the link below and click on ‘Run’.
http://plnkr.co/edit/iWQgTveUCcrHzGwk1shW
With kind regards,
I created a an angular-less sample to make sure it wasn't Angular-specific. See http://jsbin.com/siwuwibavi/edit?html,css,output - adding more rows will make the map height calculation incorrect. It's not an issue with tiles not loading, but the map not having space to display it.
Looking closer at your sample (and my jsbin), it seems like it works fine with 20-ish rows, but not when using 50+ rows. So there's something funky with the table height. We will look into that more. Thanks for reporting this issue.
Cees van Altena Yes, this is a bug. However, you can also set the height of the view directly in the MapView constructor (view.height). Here's a link to the doc: https://developers.arcgis.com/javascript/beta/api-reference/esri-views-MapView.html#height.
When you set the height inside the constructor instead of CSS, it seems to work as expected in your sample. View my bin here demonstrating this: JS Bin - Collaborative JavaScript Debugging
This can be a current work around to your issue, although setting the CSS directly should work as well.