0

コントローラ：

function ProductListCtrl($scope, Product) {
    $scope.page = 1;

    $scope.setPage = function(page) {
        $scope.page = page;
    }

    Product.query({page:$scope.page}, function(response) {
        $scope.products = response.records;
        $scope.product_count = response.metadata.count;
        $scope.page_count = response.metadata.page_count;
    });
}

意見：

<div class="container-fluid">
    <div class="row-fluid">
        <div class="span2">
        <!--Sidebar content-->

        Search: <input ng-model="query">

        </div>
        <div class="span10">
        <!--Body content-->
            Number of products: {{product_count}}.<br>
            Page {{page}} of {{page_count}}.

            <ul class="products">
                <li ng-repeat="product in products | filter:query | orderBy:orderProp" class="thumbnail">
                    <a href="#/products/{{product.id}}" class="thumb"><img ng-src="{{product.imageUrl}}"></a>
                    <a href="#/products/{{product.id}}">{{product.name}}</a>
                    <span ng-repeat="category in product.categories">{{category.name}}</span>
                </li>
            </ul>

            <a href="#" ng-class="{disabled: page < 2}" ng-click="setPage(page-1)">Previous page</a>
            <a href="#" ng-class="{disabled: page == page_count}" ng-click="setPage(page+1)">Next page</a>
        </div>
    </div>
</div>

「次のページ」リンクをクリックすると、setPage関数は正しいページ番号 (次のページ) で呼び出されますが、ページ変数はビューで更新されません。リストはバックエンドから再読み込みされますが、元のページ番号が付けられています。

私は何を間違っていますか？

4

2 に答える 2

0

$scope.$apply() を呼び出す必要がある場合があります

于 2013-05-26T12:05:47.497 に答える
0

<div ng-controller="ProductListCtrl">あなたの視界の周りに何かがあると思いますか？

また、Product.query一度だけ呼び出されるため、サーバーに再度クエリを実行する必要がある場合は、これを関数にラップしてsetPage、ユーザーがクリックしたときに呼び出すことができます。

var updateProducts = function() {
    Product.query({page:$scope.page}, function(response) {
        $scope.products = response.records;
        $scope.product_count = response.metadata.count;
        $scope.page_count = response.metadata.page_count;
    });
}

updateProducts(); // call it once when the controller is initialised

$scope.setPage = function(page) {
    $scope.page = page;
    updateProducts(); // call it again after the user clicks
}

設定しただけ$scope.pageではトリガーされないProduct.queryので、自分で呼び出す必要があります。

于 2013-05-26T12:21:00.150 に答える