.withColVis（）在angularjs中不工作

當我嘗試在angularjs數據表中使用.withColVis()然後DTOptionsBuilder.fromSource(...).withPaginationType(...).withColVis is not a function錯誤生成。.withColVis（）在angularjs中不工作

檢查這個運動員。 plunkr link

如果我使用.withDOM()那麼它工作。檢查這個plunker.

我還需要參考從官方網站check this link：

幫我解決這個問題，我想在我的應用程序中使用.withColVis()。

.withColVis()用於顯示列列表。

.withColVis()和.withDOM('<"H"Cr>t<"F"ip>')執行相同的功能，如顯示Show/Hide column選項。但.WithDOM()正在工作，並且.withColVis()不起作用。

不工作代碼：

(function(angular) { 
    'use strict'; 
    angular.module('datatablesSampleApp', ['datatables']). 
    controller('simpleCtrl', function($scope, DTOptionsBuilder, DTColumnBuilder) { 
    $scope.dtOptions = DTOptionsBuilder.fromSource('data.json') 
     .withPaginationType('full_numbers') 
     // Active ColVis plugin 
     .withColVis() 
     // Add a state change function 
     .withColVisStateChange(function(iColumn, bVisible) { 
     console.log('The column' + iColumn + ' has changed its status to ' + bVisible) 
     }) 
     // Exclude the last column from the list 
     .withColVisOption('aiExclude', [2]); 
    $scope.dtColumns = [ 
     DTColumnBuilder.newColumn('id').withTitle('ID'), 
     DTColumnBuilder.newColumn('firstName').withTitle('First name'), 
     DTColumnBuilder.newColumn('lastName').withTitle('Last name') 
    ]; 
    }); 
})(angular);

工作代碼：

(function(angular) { 
    'use strict'; 

    angular.module('datatablesSampleApp', ['datatables']) 
    .controller('SimpleCtrl', SimpleCtrl); 

    function SimpleCtrl(DTOptionsBuilder, DTColumnBuilder) { 
    var vm = this; 
    vm.dtOptions = DTOptionsBuilder.newOptions() 
     .withOption('sAjaxSource', 'data.json') 
     .withDataProp('data') 
     .withDOM('<"H"Cr>t<"F"ip>') 
     .withPaginationType('full_numbers') 
     .withDisplayLength(10); 
    vm.dtColumns = [ 
     DTColumnBuilder.newColumn('id', 'ID'), 
     DTColumnBuilder.newColumn('firstName', 'First name'), 
     DTColumnBuilder.newColumn('lastName', 'Last name') 
    ]; 

    } 
})(angular);

來源

2017-09-28 chirag satapara

您必須包括angular-datatables.colvis.js爲了從分叉plnkr得到（廢棄）ColVis插件工作，在這裏：

<script src="https://rawgithub.com/l-lin/angular-datatables/v0.6.2/dist/plugins/colvis/angular-datatables.colvis.js"></script>

和注入datatables.colvis模塊：

angular.module('datatablesSampleApp', ['datatables', 'datatables.colvis']).

https://plnkr.co/edit/edZcE3DLjaDSuNhTu2MV?p=preview

來源

2017-09-29 10:02:25 davidkonrad

非常感謝你對你的幫助 –

有可能挽救列的可見性狀態？，並且當用戶訪問該頁面時再次呈現該狀態？ –

@chiragsatapara，我不知道你是否使用'.withColVis'（它被棄用，從來沒有與AD一起使用過它），但是當我使用'**按鈕**和'.withOption（'stateSave' ，true）'然後可見/隱藏的列自動被「記住」，存儲在本地計算機上的localstorage中。我在任何地方使用AD，多個項目 - 所以它失敗了。 – davidkonrad

.withColVis（）在angularjs中不工作

回答

相關問題