与 angularjs 动态数据一起使用时出现 Jquery 数据表重新加载问题



嗨,我正在使用带有 angularJs 参考站点的 jquery dataTable 是: https://codepen.io/kalaiselvan/pen/rLoVkE 这对于静态数据很好,但是我正在绑定数据库中的数据 它的创建问题。数据显示我没有可用数据的消息。我是 将 UI 路由器用于单页应用程序。

网页代码 :

<table class="table table-bordered bordered table-striped table-condensed 
datatable table-hover"
ui-jq="dataTable" ui-options="wfPkgTblOpt" id="wfPkgTbl">  
<thead>
<tr>
<th style="display:none" >Package ID</th>
<th>#</th>
<th>Package Name</th>
<th>Client Name</th>
</tr>
</thead>
<tbody>
<tr  ng-repeat="pkg in pkgWFList" ng- 
include="getPkgWf(pkg);"> 
</tr>
</tbody> 
</table> 
<script type="text/ng-template" id="pkgWfView.html" >
<td style="display :none"> {{pkg.packageId}}</td>   
<td style="text-align:center;">{{$index+1}}</td>
<td> {{pkg.packageName}}</td>   
<td> {{pkg.clientName}}</td>   
</script>
</div>

Angularjs 控制器代码:

$scope.wfPkgTblOpt = {
//custom datatable options
destroy: true,
// "aLengthMenu": [[5,10,15,-1], [5, 10, 15,'All']],
"bPaginate": true ,
"bLengthChange": false,
"autoWidth": false,
"lengthChange": false,
"pageLength": 5 ,
};

$scope.getUserPackages = function(userId){
console.log( "getUserPackages--for UserID--->"+userId);
$http({
method : "GET",
url : "package/getPackages.htm",
params:{'userId':userId}
}).then(function mySuccess(response) {
//console.log("pkgList "+JSON.stringify(response.data));
$scope.pkgWFList = response.data;        
var  pkgId = $scope.pkgWFList[0].packageId ;
$scope.getWorkflow (pkgId);
$scope.getVectors(pkgId);
}, function myError(response) {
$scope.danger(response.statusText);
});
};      
$scope.getUserPackages($scope.userId); 

UI-路由器代码 :

//Root state-3
.state('workFlow', {
name: 'workFlow',
url: '/workFlow',
views: {
lazyLoadView: {
// controller: 'WorkFlowController',
templateUrl: 
'appResources/angular/view/workFlow.html'
}
},
resolve: {
loadMyCtrl: ['$ocLazyLoad', function ($ocLazyLoad) {
// returning string
return 
$ocLazyLoad.load('appResources/angular/controller/WorkFlowController.js');
}],
loadMyService: ['$ocLazyLoad', function 
($ocLazyLoad) {
// returning string
return 
$ocLazyLoad.load('appResources/angular/service/WorkFlowService.js');
}],
load: function ( ) {
console.log("do something here ");
}
} 
}) 

有人可以告诉我如何使用动态数据,其中多个 操作将在那里。

您好,使用 Angularjs 数据表来满足您的要求,这样您将来不会遇到任何问题

请检查以下链接并尝试实现 url 文档中指定的数据表。

http://l-lin.github.io/angular-datatables/archives/#!/welcome

最新更新