jquery - 与 angularjs 动态数据一起使用时 Jquery 数据表重新加载问题
问题描述
嗨,我正在使用带有 angularJs 参考站点的 jquery dataTable 是: https ://codepen.io/kalaiselvan/pen/rLoVkE 这对于静态数据很好,但我正在从数据库绑定数据,然后是它的创建问题。数据显示我没有可用的数据消息。我正在将 UI 路由器用于单页应用程序。
HTML 代码:
<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
推荐阅读
- django - 如何在 django REST 中通过相关表的外键过滤模型对象
- codeigniter - 如何清除在codeigniter中登录网站时出现的错误?
- postgresql - 对于 xml - postgresql 中的类似功能
- javascript - 使用 JQuery 单击任意 2 个按钮时交换按钮文本
- r - 如何使用正则表达式返回部分字符串
- ssis - SSIS:如何设置延迟时间或等待来自 Web 服务的连接的任务
- apache-spark - 作业之间的 Apache Spark 延迟
- html - 为什么我的 CSS 可以使用一个 id,但不能使用另一个 IDENTICAL id?
- c# - 互相关,对中零频率元素
- angular - 防止 ng build 检查 index html