miaoyaoyao / angularjs-ui

AngularJs Pagination Angularjs分页 -- Want to be the best pagination.

AngularJs Pagination -- Want to be the best Pagination

Since name for a pagination is boring, so I decide name it to tm.I'm not good at English, wish you you catch what I said And help me improve my English.

tm.pagination -- A very simple and useful pagination in AngularJs

Online demo tm.pagination

relate blog articles:

• https://www.miaoyueyue.com/archives/791.html
• https://www.miaoyueyue.com/archives/813.html
• https://www.miaoyueyue.com/archives/833.html

default:

with some css and template change you can turn it to this

// in the view
<tm-pagination conf="paginationConf"></tm-pagination>

// in the controller
$scope.paginationConf = {
    currentPage: 1,
    totalItems: 8000,
    itemsPerPage: 15,
    pagesLength: 15,
    perPageOptions: [10, 20, 30, 40, 50],
    onChange: function(){

    }
};

conf is a object, it has attributes like below:

• currentPage: Current page number, default 1
• totalItems: Total number of items in all pages
• itemsPerPage: number of items per page, default 15
• onChange: when the pagination is change, it will excute the function
• pagesLength: number for pagination size, default 9
• perPageOptions: define select how many items in a page, default [10, 15, 20, 30, 50]

if you want to use with ajax,you may follow like this:

$scope.paginationConf = {
    onChange: function() {
        $http.get('xxx', function(data) {
            $scope.paginationConf.totalItems = data.totalItems;
        })
    }
};

angularjs-ui's Issues

初始化两次请求问题

平常情况下使用不会出现这个问题，如果我根据条件再次加载数据，当前页码在6，我需要变成1的时候就会触发2次请求，看了源码里面有判断，但是还是加载了2次，我的解决方法如下：
if (oldValue.split(' ')[1] != "undefined" && oldValue.split(' ')[1] == newValue.split(' ')[1])return;
页面首次加载oldValue.split(' ')[1] 的值是undefined
大大使用了oldValue和newValue来判断，按照条件再次加载页码恢复1，如果这2次页码都是1就不再去触发后面的事件

麻烦请教下当前页码与跳转页码（jumpPageNum）的绑定部分，谢谢

你好麻烦请教下，点击页码的时候给jumpPageNum赋值的操作在哪里呢？我仿照你的代码写了个分页，遇到一个问题，当不手动改变jumpPageNum的时候，点击页码列表，给jumpPageNum赋值，可以成功；但当手动输入跳转到哪一页（手动改变jumpPageNum的值）之后，再点击页码列表jumpPageNum的值就不变了。然后我参照你写的例子，没找到当点击页码的时候给jumpPageNum赋值的地方，所以想麻烦请教下这块是怎么实现的，期待回复多谢啦Thanks♪(･ω･)ﾉ

使用">>"和“<<”翻页时当前页码不变化

点击页码时可用，点击上一页下一页时当前页码不变化,修改源码中 “prevPage” 和 “nextPage” 添加 getPagination(); 即可修改修复

how to config two pagiantion in two tables of one page

two tables in one page, when i want to change the fist conf.perPageOptions ,the other also changed,this is not i want;
how to config it

TypeError: Cannot read property 'pagesLength' of undefined

使用此插件，提示上面所说错误，这个是怎么回事？

还是有会发生两次请求的情况

添加搜索条件，如果没有查询到数据，会再次发送请求，而此时当前页是0

在本地运行，没有样式，无法操作，什么情况