0

footable3 を angularjs で動作させる際に問題が発生しています。すべてが期待どおりに機能しているようです。<a/>ただし、 footable3 は表のセル内のリンクをすべて削除しています。以下のコードですが、属性「my-footable」を削除するとリンクが表示されます(テーブルを調べて、リンクがあり<a/>ます)が、ディレクティブを使用するときにそれらが削除される理由がわかりません(テーブルを調べて、リンクがありません)<a/>リンク)

angularjs/footableを出発点として使用しました

これが私の指示です

app.directive('myFootable', function () {
  return function (scope, element) {

    var footableTable = element.parents('table');

    if (!scope.$last) {
      return false;
    }

    scope.$evalAsync(function () {

      if (!footableTable.hasClass('footable-loaded')) {
        footableTable.footable();
      }

      footableTable.data('__FooTable__').draw();

    });
  };
}

これが私のテーブルです

 <table class="table footable">
          <thead>
            <tr>
              <th>Team</th>
              <th>Player</th>
              <th data-breakpoints="xs sm" data-type="number">Games</th>
              <th data-sorted="true" data-direction="DESC" data-type="number">Points</th>
            </tr>
          </thead>
          <tbody>
            <tr ng-repeat="item in players" my-footable>
              <td>{{item.teamName}}</td>
              <td><a href="/#/players/{{item.playerId}}">{{item.playerName}}</a></td>
              <td class="text-right">{{item.games}}</td>
              <td class="text-right">{{item.points}}</td>
            </tr>
          </tbody>
        </table>
4

1 に答える 1

1

ディレクティブを次のように変更することで機能するようになりました。

 function () {
  return function ($compile, scope, element) {

    if (!scope.$last) {
      return false;
    }

    var footableTable = element.parents('table');

    scope.$evalAsync(function () {

      if (!footableTable.hasClass('footable-loaded')) {
        footableTable.footable();
      }

      footableTable.data('__FooTable__').draw();

      $compile(element.contents())(scope);
    });
  };
}
于 2015-12-25T19:16:29.160 に答える