3

ページネーションについては、こちらの例に従おうとしています。

新しいページ番号を表示できる段階に到達できましたが、クリック イベントを発生させることができません。data-ng-click="setPage()"以下の例のページャーでトリガーするにはどうすればよいですか

<!doctype html>
<html ng-app="PagingModule">
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.js"></script>
    <script type="text/javascript" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.5.0.js"></script>
    <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css"
        rel="stylesheet">
    <script type="text/javascript">

        var PagingModule = angular.module('PagingModule', ['ui.bootstrap']);

        PagingModule.controller('PaginationCtrl', function PaginationCtrl($scope) {


            $scope.noOfPages = 7;
            $scope.currentPage = 1;

            $scope.setPage = function () {
                alert("in");//I am unable to reach this code

            };
        }
        );


    </script>
</head>
<body>
    <div ng-controller="PaginationCtrl" class="well well-small">
        <pagination data-ng-click="setPage()" boundary-links="true" num-pages="noOfPages"
            current-page="currentPage" class="pagination-small" previous-text="&lsaquo;"
            next-text="&rsaquo;" first-text="&laquo;" last-text="&raquo;"></pagination>
        {{currentPage}}
    </div>
</body>
</html>
4

2 に答える 2

12

使用するng-change

Angular ブートストラップ ページネーションでは、ng-change属性を使用できます。ページングが変更されたときに呼び出される可能性のある関数を表します。次を使用して現在のページを取得しますng-model。

<pagination ... ng-change="setPage()" ng-model="current_page"></pagination>

古いバージョンの場合 <= 0.11

コントローラーで関数を定義し、次を使用して属性を渡すことができますon-select-change。

<pagination ... on-select-change="setPage(page)"></pagination>

詳細はこちら: https://github.com/angular-ui/bootstrap/blob/master/src/pagination/docs/readme.md

コードの重大な変更については、こちらを参照してください。

于 2013-10-02T08:39:09.577 に答える