AngularJS ng-Grid啟動最小化了嗎？

Question

我正在使用ng-Grid v2.0.7，問題是ng-grid第一次顯示時，它已被最小化。 這是我的意思的圖片：

僅在單擊最小化表（頂部圖片）后，整個表才能正常顯示（底部圖片）。這是我正在使用的代碼：

$scope.gridOptions = {
    data: 'jsonData.value',
    multiSelect: false
};

為什么會這樣呢？

編輯：這是html文件中的定義：

<div class="gridStyle" ng-show="(dataViewType == 'table')" ng-grid="gridOptions"></div>

Answer 1

嘗試在網格元素上使用ng-cloak指令。

例如在一個簡單的div上：

<div ng-cloak></div> 

“ ngCloak指令用於防止在加載應用程序時瀏覽器以原始（未編譯）形式簡短地顯示Angular html模板。使用此指令可避免html模板顯示引起的不希望的閃爍效果。”

文件： http : //docs.angularjs.org/api/ng.directive : ngCloak

Answer 2

我有一個類似的問題，它是由CSS屬性引起的。

這是因為我將高度和寬度設置為百分比，而不是固定的像素數。

將它們更改為固定數量的像素可以解決此問題（僅讓我留意要選擇哪些值來容納我的動態JSON數據的問題）。

我最終在控制器中得到了這個：

    $scope.getTableStyle= function() {
       var rowHeight=30;
       var headerHeight=45;
       return {
          height: (gridHeaderHeight + 1 + 
                  ($scope.myGrid.length * (gridRowHieght + 1))) + "px"
       };
    };  

這在我的HTML中

   <div ng-show="myGrid" class="gridStyle" ng-grid="gridOptions" 
        ng-style="getTableStyle()" ng-cloak></div>

為了計算網格大小，每當我定期從服務器獲取新的JSON數據時。