html - 如何将 2 ui-grid 与 ng-hide 和 ng-grid 一起使用？

Question

我是 angularjs 的新手，我想创建一个页面，我想在其中添加 2 个 ui-grid 和一个名为“other-grid”的按钮，第一次它必须加载第一个网格，当我们再次单击时，第一个网格必须替换为第二个网格但是有一些问题我想使用 ng-show 和 ng-hide 它适用于第一个网格但不能正确加载第二个网格为什么如此和任何解决方案请..

Answer 1

确保为“其他”隐藏网格提供适当的高度和宽度，以便框架知道网格尺寸

您可以尝试使用 ng-if、ng-show、ng-hide 并在单击按钮时使其他网格可见 - “其他网格”

这是官方的 UI 网格教程，它的功能与您想要的类似

Answer 2

在处理 ui-grid 时，您可能最好使用 ng-if。

至于 ng-show，它在渲染 ui-grids 时会做一些奇怪的事情（参考：https ://github.com/angular-ui/ui-grid/issues/4559 ）

这是带有工具按钮的 2 个网格的 plunker： http ://plnkr.co/edit/IGF6X7SqtFdFSk8jiory?p=preview

 <button ng-click="toggleuigrid()">toggle grid</button>
 <div class="row">
     <div class="span4" ng-if="show">
         <div id="grid1" ui-grid="gridOptions1" class="grid" ></div>
     </div>

    <div class="span4" ng-if="!show">
        <div id="grid2" ui-grid="gridOptions2" class="grid"  ></div>
    </div>
 </div>