AngularJS ng-table 用 jquery 手风琴固定标题

【问题标题】：AngularJS ng-table fixed headers with jquery accordianAngularJS ng-table 用 jquery 手风琴固定标题
【发布时间】：2015-10-04 11:39:35
【问题描述】：

我正在使用 Angular js ng-table 来显示一些信息。我想用滚动条固定 ng-table 的标题。此外，我需要在 ng-table 之前放置一个手风琴。

当我折叠手风琴时，我的 ng-table 固定标题无法正常工作。请参考我创建的 plunker："http://plnkr.co/edit/FGjU46cCMuhIdyacffHl?p=preview"

【问题讨论】：

你真的不想同时使用 Angular 和 Jquery。我建议你使用 angular-ui-bootstrap 手风琴来实现连贯性。

标签： javascript jquery css angularjs slimscroll

【解决方案1】：

现有代码的问题是固定标题的 stickyTableHeaders() 计算在手风琴展开折叠时没有得到更新。

解决此问题的唯一方法是禁用手风琴动画，然后通过 JQuery UI 手风琴在回调中应用 stickyTableHeaders() 函数，如下所示：

 $( "#accordion" ).accordion({
      collapsible: true,
      animate :false,
      activate: function( event, ui ) {
        $('.table').stickyTableHeaders({ scrollableArea: container, "fixedOffset": 2 });
      },
      beforeActivate: function( event, ui ) {
         $('.table').stickyTableHeaders({ scrollableArea: container, "fixedOffset": 2 })
      }

    });

您需要禁用动画，因为没有为动画事件提供回调。

【讨论】：