2016-04-19 4 views
2

質問の背景:

私はAngularJSを学んでいます。私は3つのフォームの入力を取る単純なアプリケーションを作成し、このフォームの提出時に改ページリストをレンダリングする必要があります。私はUI-Bootstrapに依存しています。これは私が自分のアプリケーションに組み込むしようとしてるページネーションの一例を示すPlnkrです:http://plnkr.co/edit/81fPZxpnOQnIHQgp957q?p=preview

問題&デモ:

これはCodePenに、これまで私のコードへのリンクです:

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

私は、SearchingServiceモデルに投入された1000個のアイテムのリストを、2つのコントローラ間で注入して共有しています。

私がトリガされていない$scope.WatchかのようにそれはあるSearchingServiceモデルのsearchingService.searchListリストが変更されたときに移入するページ分割ng-repeat、 取得することはできません。

これの最下部に手をつけていただければ幸いです。

答えて

1

$watchCollectionに変更する必要があります。しかし、この変更は、ページネーションが壊れているので、あなたのアプリケーションがあなたの現在のコードで正しく動作するのに十分ではありません。

また、あなたは複製する例の一つとして、改ページを制御するために、別のウォッチャーを追加する必要があります

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

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

また$scope.items配列はそれでsearchListsを複製取得した混乱改ページの長さをでしょう。

この例では、Plunkerを作成しました。この例では、完全に動作する例を見ることができます。

4

$watchから$watchCollectionに変更してください。あなたのサービスが(.pushを介して)配列に突然変異を起こしているので、参照は同じままであるので、$watchはトリガーしません。 $watchCollectionの配列への参照ではなく、配列のメンバーへの参照を監視します。

関連する問題