AngularJS-Tabellendaten werden nicht aktualisiert, wenn uib-Pagination in eine andere Anweisung eingeschlossen wird?

Question

Ich generierte mein Projekt mit JHipster und eine meiner Entitäten verwendet Paginierung(). Alles funktioniert gut, aber ich möchte eine Seitengröße Option mit Seitenumbruch einschließen. Aber ich sehe keine Option dafür in UI Bootstrap-Dokumentation. Daher habe ich die uib-pagination-Direktive in eine benutzerdefinierte Direktive verpackt. Hier

ist die Richtlinie:

'use strict'; 
//angularJS directive for Spring Pagination with page size control. 

angular.module('myApp') 
    .directive('springPagination', function(){ 
     return{ 
      restrict: 'AE', 
      replace: true, 
      scope: true, 
      templateUrl: 'scripts/components/pagination/spring-pagination.html', 
      controller: 'my_entity_controller' 
     }; 
    }) 

Hier ist die Vorlage (HTML):

<div class="row row-sm-height" id="pagination_div"> 
    <div class="col-md-6 pagination_panel col-xs-12" id="pagination_left"> 
     <uib-pagination class="pagination-md" total-items="totalItems" 
      ng-model="page" ng-change="loadAll()" rotate="false" 
      boundary-links="true" boundary-link-numbers="true" max-size="7"></uib-pagination> 
    </div> 
    <div class="col-md-6 pagination_panel col-xs-12" id="pagination_right"> 
     <div class="row pagination_panel_row"> 
      <div class="col-xs-4 pagination_panel_item"> 
       <label>Items Per Page:</label> 
      </div> 
      <div class="col-xs-4 pagination_panel_item"> 
       <input class="form-control" placeholder="Items per Page" 
        type="number" min="5" max="100" ng-model="newItemPerPage"></input> 
      </div> 
      <div class="col-xs-4 pagination_panel_item"> 
       <button type="button" class="btn btn-info" 
        ng-click="setItemPerPage()">Set</button> 
      </div> 
     </div> 
    </div> 
</div> 

Wenn ich auf den Punkt auf meiner benutzerdefinierten Richtlinie, zum Beispiel die Seitennummer oder setzen Seite Bei einer Größe von 50 kann AngularJS den neuen Wert abrufen und eine REST-Anforderung an den Server und die Serverantwort mit neuen Daten senden. Meine Tabelle bleibt jedoch die gleiche Seite ohne Änderungen.

Kann mir bitte jemand eine Wegbeschreibung geben? Warum werden meine Daten nicht ohne die benutzerdefinierte Anweisung aktualisiert? Vielleicht gibt es eine eingebaute Option für ui.bootstrap.pagination, um die Seitengröße anzuzeigen, so dass ich keine benutzerdefinierte Anweisung erstellen muss, damit es weniger Ärger gibt ??

Answer 1

Dumm mich. Es stellt sich heraus, dass mein Ansatz machbar ist, aber ich habe vergessen, Apostroph auf dem booleschen Wert zu verwenden. Also im Grunde:

scope: true 

sollte sein:

scope: 'true' 

Ich bin ziemlich sicher, dass ich andere Tutorials sah die

Bereich zu verwenden: true

ohne zu den Apostroph. Aber na ja, zumindest mein Problem gelöst ...

auch, gibt es keine Notwendigkeit, setzte Controller und ersetzen Option (na ja, zumindest für meinen Anwendungsfall ich brauche nicht zu) weil ich möchte, dass meine Anweisung denselben Controller aus dem HTML-Code verwendet, auf den ich diese benutzerdefinierte Anweisung angewendet habe.