问题
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.
I am totally stuck with this & would greatly appreciate any help which you can give. Thanks.
回答1:
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
来源:https://stackoverflow.com/questions/23177490/angular-ng-grid-in-a-nested-tab