4

ビューで私はこれを持っています:

     <table class="table table-bordered" id="resultsTable">
        <thead>
          <th>Classification</th>
          <th>Date</th>
        </thead>
        <tr ng-repeat="result in results">
          <td>{{result.result}}</td>
          <td>{{result.date}}</td>
        </tr>
      </table>

フローティングヘッダーを使用したいのですが、ページが最初に読み込まれたときにテーブルが空であるため、奇妙な結果が得られます ( http://www.fixedheadertable.com/ )

テーブルのコンテンツが静的である場合、これはうまく機能します:

$(document).ready(function() {
  $('#resultsTable').fixedHeaderTable({ footer: true, cloneHeadToFoot: false, fixedColumn: false   });
});

コントローラーには、ボタンを押した後にデータをロードする次の関数があります。

 $scope.loadResults = function() {
    var url = "URL WITH QUERY";
    $http.get(url).success(
      function(data, status, headers, config) {
        for (var i = 0; i < data.length; i++) {
            $scope.results.push({date: data[i].date, p: data[i].p, result: data[i].result});
        }

//**IDEALLY I WOULD WANT TO RUN THE JQUERY LINE HERE**

      }
    );
  };

したがって、すべてのデータを結果配列にロードした後、通常はドキュメントの準備ができているときに実行するこの行を実行します。

どのようにしますか?

「ディレクティブ」について読み続けているので、例を提供してください。しかし、jquery を呼び出す方法、必要な jquery の行を配置する方法、またはコントローラーから呼び出す方法については誰も教えてくれません。

4

2 に答える 2

1

これを行うことを妨げるものは何もありません:

$scope.loadResults = function() {
    var url = "URL WITH QUERY";
    $http.get(url).success(
      function(data, status, headers, config) {
        for (var i = 0; i < data.length; i++) {
            $scope.results.push({date: data[i].date, p: data[i].p, result: data[i].result});
        }
        $('#resultsTable').fixedHeaderTable({ footer: true, cloneHeadToFoot: false, fixedColumn: false   });
      }
    );
  };

しかし、ベスト プラクティスとは見なされません。

さらに、ng-repeat が処理されるように、Angular ダイジェスト サイクルが完了するまで待機する必要がある場合があります。$timeout()どちらかまたはおそらくaを使用してそれを行うことができます$scope.$evalAsync()(この場合、後で動作するかどうかは100%確信が持てません。まだ起動が早すぎる可能性があるため、テストする必要があります)。

よりクリーンな解決策は、そのプラグインのディレクティブを作成することです。動的データを許可するFixed Header Tableプラグインのドキュメントには何も表示されないため、データの準備が整ってレンダリングされた後に初期化が行われることを保証するか、結果を監視して、その問題を解決する必要があります。destroyプラグインを呼び出して再初期化するための配列。

于 2013-06-01T23:20:17.360 に答える