Question

我使用Datatables和AngularJS以及FixedHeader插件，当页面上显示表格时，它可以正常工作。我的问题是，当我使用角度UI路由器导航到不同的页面（单页面应用程序）时，仍会显示FixedHeader标题。

有人知道为什么会这样吗？

Answer 1

对于FixedHeader的DataTables插件，这似乎是一个问题。

在https://l-lin.github.io/angular-datatables/#/welcome有一个angular-DataTables模块，它有一个关于与之配合使用的插件的页面。此页面列出了FixedHeader插件，并提到了您所看到的同一问题。

请参阅https://l-lin.github.io/angular-datatables/#/withFixedHeader。

此页面说明如下：

使用路由器时要小心。似乎页眉和页脚留在了即使您更改了应用程序状态，也可以使用DOM。所以你需要调整代码以在退出状态时删除它们。

它还显示了angular-ui-router的解决方法：

$stateProvider.state("contacts", {
  templateUrl: 'somewhereInDaSpace',
  controller: function($scope, title){
    // Do your stuff
  },
  onEnter: function(title){
    // Do your stuff
  },
  onExit: function(){
    // Remove the DataTables FixedHeader plugin's headers and footers
    var fixedHeaderEle = document.getElementsByClassName('fixedHeader');
    angular.element(fixedHeaderEle).remove();
    var fixedFooterEle = document.getElementsByClassName('fixedFooter');
    angular.element(fixedFooterEle).remove();
  }
});

修复当我们在单页面应用程序中导航到不同页面时显示的标题

1 个答案: