zhaozhaoqi
diff --git a/‎README.md‎
100644100755
Lines changed: 38 additions & 3 deletions b/‎README.md‎
100644100755
Lines changed: 38 additions & 3 deletions
diff --git a/‎demo/pagination.html‎
Lines changed: 55 additions & 0 deletions b/‎demo/pagination.html‎
Lines changed: 55 additions & 0 deletions
@@ -1,4 +1,39 @@
-ng
-==
+# AngularJs UI -- Want to be the best UI
+
+Since name for a UI 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
+On line demo [tm.pagination](http://demo.miaoyueyue.com/js/AngularJs-UI/demo/pagination.html)
+
+    // 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],
+        rememberPerPage: 'perPageItems',
+        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: defind select how many items in a page, default [10, 15, 20, 30, 50]
+*   rememberPerPage: use to remember how many items in a page select by user.
+
+
+
+
+
+
 
-AngularJs UI 
 
@@ -0,0 +1,55 @@
+<!doctype html>
+<html ng-app="myApp">
+<head>
+    <meta charset="UTF-8">
+    <link rel="stylesheet" href="../lib/bootstrap/3.2.0/css/bootstrap.min.css">
+    <style>
+        .page-list .pagination {float:left;}
+        .page-list .pagination span {cursor: pointer;}
+        .page-list .pagination .separate span{cursor: default; border-top:none;border-bottom:none;}
+        .page-list .pagination .separate span:hover {background: none;}
+        .page-list .page-total {float:left; margin: 25px 20px;}
+        .page-list .page-total input, .page-list .page-total select{height: 26px; border: 1px solid #ddd;}
+        .page-list .page-total input {width: 40px; padding-left:3px;}
+        .page-list .page-total select {width: 50px;}
+    </style>
+</head>
+<body ng-controller="testController">
+
+<tm-pagination conf="paginationConf"></tm-pagination>
+
+<script src="../lib/angularjs/1.2.22/angular.min.js"></script>
+<script src="../src/pagination/tm.pagination.js"></script>
+<script>
+    angular.module('myApp', ['tm.pagination']).controller('testController', function($scope){
+        /**
+         * I'm not good at English, wish you you catch what I said And help me improve my English.
+         *
+         * A lightweight and useful pagination directive
+         * 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: defind select how many items in a page, default [10, 15, 20, 30, 50]
+         * rememberPerPage: use to remember how many items in a page select by user.
+         *
+         */
+        $scope.paginationConf = {
+            currentPage: 1,
+            totalItems: 8000,
+            itemsPerPage: 15,
+            pagesLength: 15,
+            perPageOptions: [10, 20, 30, 40, 50],
+            rememberPerPage: 'perPageItems',
+            onChange: function(){
+
+            }
+        };
+    })
+</script>
+</body>
+</html>