AngularJS - Paginierung nicht auf $ scope.Watch Änderung Rendering (CodePen enthalten)

Question

Frage Hintergrund:

Ich lerne AngularJS. Ich habe eine einfache App erstellt, die 3 Formulareingaben annimmt, und bei Einreichung dieses Formulars sollte eine paginierte Liste gerendert werden. Ich habe eine Abhängigkeit von UI-Bootstrap. Dies ist ein Plnkr zeigt die Paginierung Beispiel, das ich in meiner Anwendung zu integrieren bin versucht: http://plnkr.co/edit/81fPZxpnOQnIHQgp957q?p=preview

Die Ausgabe & Demo:

Dies ist der Link zu meinem Code so weit auf CodePen:

http://codepen.io/daveharris/pen/NNMQyy

Ich habe eine Liste von 1000 Artikeln, die auf meinem SearchingService Modell auffüllen, das zwischen den zwei Controllern injiziert und geteilt wird.

Ich kann nicht die paginierte ng-repeat erhalten zu füllen, wenn die searchingService.searchList Liste auf das SearchingService Modell geändert wird, Es ist, als ob die $scope.Watch nicht ausgelöst wird.

Jede Hilfe, die auf den Grund davon kommt, wird sehr geschätzt.

Answer 1

Wie Bchemy darauf hingewiesen, sollte $watch zu $watchCollection geändert werden. Diese Änderung wird jedoch nicht ausreichen, damit Ihre App mit Ihrem aktuellen Code ordnungsgemäß funktioniert, da die Paginierung fehlerhaft aussieht.

Sie sollten auch andere Beobachter fügen Sie die Paginierung wie das in dem Beispiel zu steuern, die Sie replizieren möchten:

$scope.$watch('currentPage + numPerPage', function() { 
    var begin = (($scope.currentPage - 1) * $scope.numPerPage) 
    , end = begin + $scope.numPerPage; 

    $scope.filteredItems = $scope.searchingService.searchList.slice(begin, end); 
    }); 

Auch $scope.items Array doppelt vorhanden war searchLists drin und würde Chaos die Paginierung Länge.

Ich habe diese Plunker erstellt, wo Sie Ihr Beispiel voll funktionsfähig sehen können.

Answer 2

Die Linie 31 von $watch zu $watchCollection ändern. Da Ihr Dienst das Array mutiert (über .push), bleibt die Referenz gleich, so dass $watch nicht ausgelöst wird. $watchCollection wird Verweise auf das Array Mitglieder anstelle der Verweis auf die Array selbst beobachten.