0

私は 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>
4

2 に答える 2

2

ng-cloakグリッド要素でディレクティブを使用してみてください。

たとえば、単純な div の場合:

<div ng-cloak></div>

「ngCloak ディレクティブは、アプリケーションのロード中に Angular html テンプレートが未加工の (コンパイルされていない) 形式でブラウザーによって短時間表示されるのを防ぐために使用されます。このディレクティブを使用して、html テンプレートの表示によって引き起こされる望ましくないちらつき効果を回避します。」

ドキュメント: http://docs.angularjs.org/api/ng.directive:ngCloak

于 2013-10-02T06:52:18.067 に答える
0

同様の問題があり、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 データを取得するたびにグリッド サイズを計算するため。

于 2014-04-23T07:08:33.753 に答える