Проблема перезагрузки таблицы данных Jquery при использовании динамических данных angularjs - PullRequest
Новая
       18

Проблема перезагрузки таблицы данных Jquery при использовании динамических данных angularjs

0 голосов
/ 14 мая 2018

Привет, я использую jquery dataTable со ссылочным сайтом angularJs: https://codepen.io/kalaiselvan/pen/rLoVkE Это хорошо для статических данных, но я связываю данные из базы данных, а затем создаю проблему.Данные показываются мне без данных. Я использую UI Router для одностраничного приложения.

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-Router: 

//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 ");
                    }
                } 

            })

Может ли какой-нибудь орган сообщить мнекак я могу работать с динамическими данными, в которых будет несколько операций манипуляции.

1 Ответ

0 голосов
/ 14 мая 2018

Здравствуйте! Используйте Angularjs datatable для выполнения ваших требований, поэтому в будущем у вас не возникнет проблем

Пожалуйста, проверьте с помощью ссылки ниже и попробуйте реализовать datatable, указанный в URL документа.

http://l -lin.github.io / Угловое-DataTables / архивы / #! / Добро пожаловать

...