Angular ng-grid in a nested tab

一笑奈何 提交于 2019-12-25 02:22:06

问题


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

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!