从表中添加删除行 - 闪烁

Question

我有一个表与NG-重复初始化行：

<table class="dataTable row-border hover" datatable="ng" dt-options="vm.dtOptions"> 
    ... 
    <tr ng-repeat="item in vm.items"> 

我的选择是：

//Reference at https://datatables.net/reference/option/ 
vm.dtOptions = { 
    paging : false, 
    searching : false, 
    info  : false, 
    autoWidth : false, 
    ordering : false, 
    responsive: true 
    }; 

问题

当我修改vm.items，与vm.items.push(...)或vm.items.splice整个表闪烁 - 消失并与新col自身物品的选择。

我该如何预防？

理想情况下，我想继续修改vm.items集合，而不是操纵表格行（除非它们确实相同）。

Answer 1

经过更多的尝试和研究，我不相信你可以避免在使用datatable="ng"时闪烁。

即使官方示例@https://l-lin.github.io/angular-datatables/#/angularWayDataChange患有此问题。

Answer 2

当我们从数据表插入或删除行时，它需要重新显示changes.it删除用于数据表的所有样式并重新呈现给table.so需要保留这些样式。 以下的CSS类可以使它更加流畅。

<table class="avoid-table-flicker dataTable row-border hover" datatable="ng" dt-options="vm.dtOptions"> 

.avoid-table-flicker{ 
    border-top: none !important; 
    width:100% !important; 
    border-collapse: separate !important; 
    background: #fff !important; 
    clear: both; 
    border-spacing: 0; 
    thead{ 
     th{ 
      text-align:left; 
      vertical-align: middle; 
      padding: 16px 8px; 
     } 
    } 
    tbody{ 
     td:first-child { 
      padding-left: 24px; 
     } 
     td{ 
      padding: 12px 8px; 
      vertical-align: middle; 
     } 
    } 
}