Smart Table Client Seitennummerierung funktioniert nicht: Apex

Question

Ich habe die Beispiele auf Smart Table zu einem 'T' verfolgt. Ich kann die Seitennummerierung für die Kundenseite nicht bearbeiten. Die Daten werden asynchron geladen, daher die st-safe-src.

Das Hauptproblem ist, dass die Seitenlänge nicht auf die definierte Länge reduziert wird und keine der Schaltflächen angezeigt wird. Es gibt keine Fehler in der Konsole.

<apex:page standardController="Account" extensions="RegulationOCheckController"> 

    <apex:stylesheet value="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" /> 

    <apex:includescript value="//code.angularjs.org/1.3.1/angular.js" /> 
    <apex:includescript value="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.0.min.js" /> 
    <apex:includescript value="//cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.0/lodash.js" /> 
    <apex:includescript value="//cdnjs.cloudflare.com/ajax/libs/angular-smart-table/2.1.8/smart-table.min.js" /> 

    <script> 

     var app = angular.module('RegulationOCheck', ['smart-table', 'ui.bootstrap']) 

     app.controller('CompareController', function($scope, DataService){ 

      DataService.regulationOCheck().then(function(data){ 

       $scope.collection = data 

      }) 


     }) 

     app.factory('DataService', ['$q', '$rootScope', function($q, $rootScope){ 

      var funcs = {} 

      funcs.regulationOCheck = function(){ 

       var deferred = $q.defer() 

       RegulationOCheckController.compare(
        '{!$CurrentPage.parameters.id}', 
        function(result, event){ 
         $rootScope.$apply(function(){ 
          if(event.statusCode >= 200 || event.statusCode < 300){ 
           deferred.resolve(JSON.parse(result)) 
          }else{ 
           deferred.reject(event) 
          } 
         }) 
        }, 
        { escape: false } 
       ) 

       return deferred.promise 

      } 

      return funcs 
     }]) 

    </script> 

    <apex:pageBlock > 

      <div ng-app="RegulationOCheck" ng-controller="CompareController"> 

       <table st-safe-src="collection" st-table="displayed" class="smart-table table"> 
        <thead> 
         <tr> 
          <th st-sort="accountName">Insider Name</th> 
          <th st-sort="similarity ">% Similarity</th> 
         </tr> 
         <tr> 
          <th colspan="2"> 
           <input st-search="accountName" placeholder="search for insider" class="input-sm form-control" type="search" /> 
          </th> 
         </tr> 
        </thead> 
        <tbody> 
         <tr ng-repeat="row in displayed"> 
          <td>{{ row.accountName }}</td> 
          <td>{{ row.similarity }}</td> 
         </tr> 
        </tbody> 
        <tfoot> 
         <tr> 
          <td class="text-center" 
           st-pagination="" 
           st-items-by-page="10" 
           st-displayed-pages="7" 
           colspan="2"></td> 
         </tr> 
        </tfoot> 
       </table> 

      </div> 

    </apex:pageBlock>  

</apex:page> 

Answer 1

Ihr Problem liegt in der DataService Fabrik, Sie erhalten Ihre Daten einen latenten Konstruktor stattdessen einen richtigen $http Anruf zu nutzen.

Sie sollten dieses Chaos ersetzen

funcs.regulationOCheck = function(){ 

      var deferred = $q.defer() 

      RegulationOCheckController.compare(
       '{!$CurrentPage.parameters.id}', 
       function(result, event){ 
        $rootScope.$apply(function(){ 
         if(event.statusCode >= 200 || event.statusCode < 300){ 
          deferred.resolve(JSON.parse(result)) 
         }else{ 
          deferred.reject(event) 
         } 
        }) 
       }, 
       { escape: false } 
      ) 
      return deferred.promise 
     } 

Mit etwas entlang der Linien von

funcs.regulationOCheck = function(){ 

      RegulationOCheckController.compare(
       '{!$CurrentPage.parameters.id}', 
       function(result, event){ 
        $rootScope.$apply(function(){ 
         if(event.statusCode >= 200 || event.statusCode < 300){ 
          return $q.when(JSON.parse(result)) 
         }else{ 
          return $q.reject(event) 
         } 
        }) 
       }, 
       { escape: false } 
      ) 
     } 

oder sogar $http

funcs.regulationOCheck = function() { 
    return $http.get("data.json"); 
} 

Und vermeiden, mit $rootScope.$apply, wird es einen Digest-Zyklus nennen für alle Anwendungen und es ist absolut nicht notwendig für Ihr Szenario ist

hier ein plunker demo