I have an app based on this plunk.
My app has grown & it probably too large & complex to post here, so let's just continue to discuss the Plunk on which it is based.
Basically, I just want to use an ng-grid, which I will populate with JSON data received from a server, on one of the nested tabs.
That wasn't working, so I tried to simplify the problem by using the exact code of the ng-grid example (see http://angular-ui.github.io/ng-grid/).
That still wasn't working, so I tried to simplify the problem by adding the ng-grid demo to the Plunk on which my code is based.
That still isn't working, as shown by this forked Plunk. If you look at it, you can search for @@@@ begin @@@@ and @@@@ end @@@@ to see what I added to each of the three files.
Note: In my app, I can see the table contents, but left aligned & overwriting each other, as if there was a maximum width or other CSS attribute involved. In my forked plunk, the grid appears to be empty.
The forked plunk did not include the ngGrid scripts or jQuery, which it depends on.
<script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script data-require="ng-grid@*" data-semver="2.0.7" src="//cdnjs.cloudflare.com/ajax/libs/ng-grid/2.0.7/ng-grid.js"></script>
<script data-require="ng-grid@*" data-semver="2.0.7" src="//cdnjs.cloudflare.com/ajax/libs/ng-grid/2.0.7/ng-grid-flexible-height.min.js"></script>
You also need to inject ngGrid into your app:
var app = angular.module('plunker', ['ui.bootstrap', 'ui.bootstrap.tpls', 'ui.router', 'ngGrid'])
Here is an update to your plunk, with these changes included: http://plnkr.co/edit/V0itOu?p=preview