Ich arbeite mit mehreren angularjs-Datentabellen und erzeuge eine neue Tabelle jedes Mal, wenn der Benutzer eine Option aus der Dropdown-Liste auswählt.Auf der Basis der Benutzerauswahl mache ich eine $ http-Anfrage abzurufen Neue Daten aus der Datenbank. Für jede Tabelle habe ich verschiedene dtColumnDefs, die dynamisch gesetzt werden, da meine Spaltenüberschriften in der Tabelle dynamisch sind mit Ausnahme der ersten beiden und letzten Spalten. Meine Absicht ist es, die Sortierung für diese dynamischen Spaltenüberschriften zu deaktivieren Die Anzahl der dynamischen Spalten führt dann eine Schleife aus, um die Sortierung für diese Spalten dynamisch zu deaktivieren. Obwohl die Datentabelle für jede Benutzereingabe erfolgreich gerendert wird, werden die Sortieroptionen für erwartete Spalten nicht deaktiviert. Überprüfen Sie die plunker für Demo.Deaktivieren der Spaltensortierung funktioniert nicht für mehrere angularjs-Datatabellen
UPDATE
Dies ist eine Demo-Tabelle zu verstehen, wie es weitergehen, aber meine Original-Tabelle ist wenig komplex, wo ich einige Datenbankzeilen zeigte, als Spaltenüberschriften, und es gibt auch einige Filter wie einzigartig, i Ich benutze auch Index-Wert, um die Seriennummer zu zählen, so konnte ich davidkonrad 's Antwort nicht akzeptieren, da ich Spalten vom Controller nicht definieren möchte.
var app = angular.module('myApp', ['datatables']);
app.controller('MyCtrl', function($scope, DTOptionsBuilder, DTColumnBuilder, DTColumnDefBuilder) {
$scope.department = [{
value: "1",
name: "sales"
},
{
value: "2",
name: "admin"
},
{
value: "3",
name: "other"
}
];
$scope.dep = $scope.selected_dep;
$scope.i = 0;
$scope.depshow = function() {
$scope.i += 1;
var x = 'v' + $scope.i;
$scope.m = 'v' + $scope.i;
$scope.dep = $scope.selected_dep;
if ($scope.dep == 1) {
$scope.list = [{
"eid": "10",
"dyn1": "dval1",
"dyn2": "dval2",
"dyn3": "dval3",
"sales": "20"
},
{
"eid": "20",
"dyn1": "dval1",
"dyn2": "dval2",
"dyn3": "dval3",
"sales": "20"
},
{
"eid": "30",
"dyn1": "dval1",
"dyn2": "dval2",
"dyn3": "dval3",
"sales": "20"
}
];
} else if ($scope.dep == 2) {
$scope.list = [{
"eid": "40",
"dyn1": "dval1",
"dyn2": "dval2",
"dyn3": "dval3",
"sales": "20"
},
{
"eid": "50",
"dyn1": "dval1",
"dyn2": "dval2",
"dyn3": "dval3",
"sales": "20"
},
{
"eid": "60",
"dyn1": "dval1",
"dyn2": "dval2",
"dyn3": "dval3",
"sales": "20"
}
];
}
if ($scope.dep == 3) {
$scope.list = [{
"eid": "70",
"dyn1": "dval1",
"dyn2": "dval2",
"dyn3": "dval3",
"sales": "20"
},
{
"eid": "80",
"dyn1": "dval1",
"dyn2": "dval2",
"dyn3": "dval3",
"sales": "20"
},
{
"eid": "0",
"dyn1": "dval1",
"dyn2": "dval2",
"dyn3": "dval3",
"sales": "20"
}
];
}
$scope.x = {};
$scope.x.dtOptions = DTOptionsBuilder.newOptions()
.withOption('order', [0, 'asc']);
$scope.ln = 4;
$scope.x.dtColumnDefs = [];
for (var i = 1; i < $scope.ln; i++) {
$scope.x.dtColumnDefs.push(DTColumnDefBuilder.newColumnDef(i).notSortable());
}
}
});<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script src="http://phpflow.com/demo/angular_datatable_demo/angular-datatables.min.js"></script>
<script src="http://phpflow.com/demo/angular_datatable_demo/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="http://phpflow.com/demo/angular_datatable_demo/datatables.bootstrap.css">
</head>
<div class="container">
<div ng-app="myApp" ng-controller="MyCtrl">
Select <select ng-model="selected_dep" ng-change="depshow()" ng-options="item.value as item.name for item in department">
<option value="">select a department</option>
</select>
<table class="table table-striped table-bordered" datatable="ng" dt-options="m.dtOptions" dt-column-defs="m.dtColumnDefs" >
<thead>
<tr>
\t <th>sr</th>
\t <th>Employee ID</th>
\t <th>dynamic clm1</th>
<th>dynamic clm2</th>
\t <th>dynamic clm3</th>
<th>sales</th>
</thead>
<tbody>
<tr ng-repeat="data in list">
<td> {{$index+1}} </td>
<td> {{ data.eid }} </td>
<td> {{ data.dyn1 }} </td>
<td> {{ data.dyn2 }} </td>
<td> {{ data.dyn3 }} </td>
<td> {{ data.sales }} </td>
</tr>
</tbody>
</table>
</div>
</div>
überprüfen Sie diese https://stackoverflow.com/questions/31027497/in-angular-js-how-to-disable-column-sort-feature-for-selected-columns –
haben meine nutzlose Antwort gelöscht.Wie schon erwähnt [https://stackoverflow.com/questions/31521000/how-to-call-the-destroy-function-of-angular-datatables/34288205?noredirect=1#comment76564487_34288205) "Thread" denke ich Du bist auf der Strecke. Sie müssen die Bindungen entfernen, d. H. Zerstören Sie die DataTable, bevor Sie neu initialisieren. – davidkonrad
@davidkonrad kann das immer noch nicht herausfinden. Überprüfen Sie http://plnr.co/edit/4Js7ZGQAbJMYQVX1NchN?p=preview – query