Question

我正在为项目使用AngularJS，UI-Grid（http://ui-grid.info/）和Bootbox。我想要做的是让用户点击屏幕上的按钮，然后打开一个对话框，从UI-Grid表格中选择一个项目。

我把最简单的例子放在一起：
http://plnkr.co/edit/YvsiAQhUrNqnSse1O0oh?p=preview

在此，我生成对话框HTML，如下所示：

var tplCrop = '<div ng-controller="MyTableDialogCtrl">{{ someText }}' +
        '<div ui-grid="gridOptions" ui-grid-pagination class="grid"></div>' +
        '</div>';
var template = angular.element(tplCrop);
var linkFn = $compile(template);
var html= linkFn($scope);

如果您点击＆＃34;我的对话框＆＃34;按钮，对话框出现，表格有一个区域，但它是空的。＆＃34; someText＆＃34;值证明我的Angular $ compile正在做它应该做的事情。

如果取消注释评论部分，您会发现UI-Grid机制似乎也正常工作。但是，由于某种原因，UI-Grid并不想在对话框内呈现。

有什么想法吗？我真的很难过。

谢谢，约翰

Answer 1

http://plnkr.co/edit/bbNVgwoTRtHZp3cKcoiB?p=preview

        onRegisterApi: function( gridApi ) {
          $scope.gridApi = gridApi;
          $timeout( function() {
            $scope.gridApi.core.handleWindowResize();
          }, 1000);
        }

在模态教程中，它提到引导模态似乎在初始渲染时运行动画，这会导致网格问题并获得准确的大小。

我注意到，当我打开chrome调试器时，在你的plunker中出现了网格 - 表明它是一种或另一种尺寸问题。

我可以通过使用1s的$ timeout和handleWindowResize让它在上面的plunker中显示。通常我可以逃脱不到1秒，但在这种情况下，在100毫秒它没有工作。

我不得不说我对此超时很不舒服，因为可能会发现不同的浏览器和设备运行速度不同，因此您最终会遇到间歇性应用。然而，您可以考虑在窗口打开后的前3秒内每隔100毫秒运行一个$间隔.....这可能会涵盖大多数情况。

无法在启动箱自定义对话框中使用ui-grid

1 个答案: