AngularJS ng-Grid CurrentPage数字无法显示

从网上搜罗一个ng-grid控件，自己动手学习时发现当前第几页没有显示，而其他的功能则一切都是OK的，原以为是我的js代码出现问题，一步步确认自己的代码没有问题后，所以我在源代码里面加了{{pagingOptions.currentPage}},但是经测试后发现currentPage是有数据的(如图一)，后来把源代码里里面的 <input class=\"ngPagerCurrent\" min=\"1\" max=\"{{maxPages()}}\" type=\"number\" style=\"width:50px;
height: 24px; margin-top: 1px; padding: 0 4px;\" ng-model=\"pagingOptions.currentPage\"/> type=\"number\"改成 type=\"text\"就好了(如图二)，可是不知道为什么会这样，希望有人能解答一下









注明一下，我是先将一个子模块myApp.ctrl.dataGrid加入到模块myApp中，然后再将ngGrid到加入到myApp.ctrl.dataGrid中的，源代码如下

[html]
view plaincopyprint?

<style type="text/css">  
    .gridStyle {  
        border: 1px solid rgb(212,212,212);  
        width: 800px;  
        height: 300px;  
    }  
  
  
    .green {  
        background-color: green;  
        color: white;  
    }  
</style>  
<div class="row" data-ng-controller="myController">  
    <div class="gridStyle" data-ng-grid="gridOptions">  
    </div>  
</div>  

[javascript]
view plaincopyprint?

angular  
    .module('myApp', [  
        'myApp.ctrl.dataGrid'  
    ])  
angular  
    .module('myApp.ctrl.dataGrid', ['ngGrid'])  
    .controller('myController', function ($scope) {  
  
  
        var self = this;  
        //基本数据属性  
        $scope.mySelections = [];  
        //Grid数据  
        $scope.myData = [];  
        //Grid 筛选  
        $scope.filterOptions = {  
            filterText: '',  
            useExternalFilter: false  
        };  
        //总共条目  
        $scope.totalServerItems = 0;  
        //设置相关页面数据  
        $scope.pagingOptions = {  
            pageSizes: [250, 500, 1000],//page 行数可选值  
            pageSize: 250, //每页行数  
            currentPage: 1, //当前显示页数  
        };  
        //操作方法设置  
        self.getPagedDataAsync = function (pageSize, page, searchText) {  
            setTimeout(function () {  
                var data;  
                if (searchText) {  
                    var ft = searchText.toLowerCase();  
                    data = largeLoad().filter(function (item) {  
                        return JSON.stringify(item).toLowerCase().indexOf(ft);  
                    });  
                }  
                else {  
                    data = largeLoad();  
                }  
  
  
                var pagedData = data.slice((page - 1) * pageSize, page * pageSize);  
                $scope.myData = pagedData;  
                $scope.totalServerItems = data.length;  
                if (!$scope.$$phase) {  
                    $scope.$apply();  
                }  
            }, 100);  
        };  
  
  
        $scope.$watch('pagingOptions', function () {  
            self.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage, $scope.filterOptions.filterText);  
        },true);  
        $scope.$watch('filterOptions', function () {  
            self.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage, $scope.filterOptions.filterText);  
        },true);  
  
  
        self.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage);  
  
  
        $scope.gridOptions = {  
            data: 'myData',  
            selectedItems: $scope.mySelections,  
            showSelectionCheckbox: true,  
            multiSelect: true,  
            showGroupPanel: false,  
            showColumnMenu: true,  
            enableCellSelection: true,  
            enableCellEditOnFocus: true,  
            enablePaging: true,  
            showFooter: true,  
            totalServerItems: $scope.totalServerItems,  
            filterOptions: $scope.filterOptions,  
            pagingOptions: $scope.pagingOptions,  
            i18n:'zh-cn',  
            columnDefs: [  
                { field: 'name', displayName: 'Very Long Name Title', sortable: false },  
                { field: 'allowance', width: 120, aggLabelFilter: 'currency', cellTemplate: '<div ng-class="{red: row.entity[col.field] > 30}"><div class="ngCellText">{{row.entity[col.field] | currency}}</div></div>' },  
                { field: 'birthday', width: '120px', cellFilter: 'date', resizable: false },  
                { field: 'paid', width: '*', cellFilter: 'checkmark' }]  
        };  
    });