http://angular-ui.github.io/bootstrap/#/pagination

分页组件只提供生成分页按钮,数据的显示需要使用ng-repeat, 注意设置 items-per-page

<div class="col-md-12" ng-show="searched_tasks.length">
<table class="table table-bordered">
<tr>
<th>序列号</th>
<th>项目</th>
<th>任务</th>
<th>当前状态</th>
<th>负责人</th>
<th>操作</th>
</tr>
<!-- <tr ng-repeat="(key, v) in searched_tasks | limitTo:search.pageSize:(search.currentPage-1)*search.pageSize"> -->
<tr ng-repeat="(key, v) in searched_tasks">
<td title="点击查看详情"><a ui-sref="app.task_detail({taskid:v.item_id})">{{v.item_id}}</a></td>
<td>{{v.project_name}}</td>
<td>{{v.item_name}}</td>
<td>{{v.item_status_name}}</td>
<td>{{v.manager_full_name}}</td>
<td><a ui-sref="app.task_edit({taskid:v.item_id})"><span class="glyphicon glyphicon-edit"></span> 编辑</a></td>
</tr>
</table>
<!-- 分页组件 -->
<ul uib-pagination ng-show="search.totalItems" total-items="search.totalItems" items-per-page="search.pageSize" class="pagination-sm" boundary-link-numbers="true" ng-change="pageChanged()" ng-model="search.currentPage"></ul>
</div>

angular-ui分页组件的更多相关文章

  1. angular自定义分页组件(实用)

    功能描述:分页,点击按钮或者下一页获取分页接口,同时active到对应页码. html模块: <page page-count="totalPage" on-click-pa ...

  2. Angular -ui - BootStrap组件的解释以及使用

    关于UI BootStrap UI BootStrap 是angularUI团队用纯粹angularJS语法编写的Bootstrap组件. 1. 关于ng-router(angular-router. ...

  3. 手把手教你使用Vue/React/Angular三大框架开发Pagination分页组件

    DevUI是一支兼具设计视角和工程视角的团队,服务于华为云DevCloud平台和华为内部数个中后台系统,服务于设计师和前端工程师.官方网站:devui.designNg组件库:ng-devui(欢迎S ...

  4. Vue+element UI实现分页组件

    介绍 这是一个是基于element-UI的分页组件基础上,进行了二次封装的分页组件,在展示数据时,该分页组件采用了每显示一页数据,只请求当前页面的数据的请求策略,从而避免了一次性将数据全部请求所造成的 ...

  5. Primeng UI框架中 分页组件用法

    1.在当前模块或当前页面的对应的module.ts文件中引入相应组件模块,如:core.module.ts模块. import { PaginatorModule } from 'primeng/pr ...

  6. ReactJS实现的通用分页组件

    大家多少都自己写过各种版本的分页工具条吧,像纯服务版的,纯jsWeb板的,Angular版的,因为这个基础得不能再基础的功能太多地方都会用到,下面我给出以个用ReactJS实现的版本,首先上图看下效果 ...

  7. 基于avalon1.4.x ----分页组件编写

    avalon分页组件 (1.4.x版本) 随着avalon2的推出,avalon1的官网已经不再维护了,现在似乎是找不到avalon 1.4版本的官方文档了,所以本文章所有的内容均不保证正确性,只能保 ...

  8. 基于vue2.0的一个分页组件

    分页组件在项目中经常要用到之前一直都是在网上找些jq的控件来用(逃..),最近几个项目用上vue了项目又刚好需要一个分页的功能.于是百度发现几篇文章介绍的实在方式有点复杂, 没耐心看自己动手造轮子写了 ...

  9. 基于angular4.0分页组件

    分页组件一般只某个页面的一小部分,所以我们它是子组件 当然如果你承认这话的,可以往下看,因为我把他当作子组建来写了 分页组件的模版 import { Component } from '@angula ...

  10. Angular动态创建组件之Portals

    这篇文章主要介绍使用Angular api 和 CDK Portals两种方式实现动态创建组件,另外还会讲一些跟它相关的知识点,如:Angular多级依赖注入.ViewContainerRef,Por ...

随机推荐

  1. C++-数据库【1】-C++连接MSSQL数据库

    测试环境—— 系统:Win7 64bit 编译器:VC++ 2015 数据库:MSSQL 2008 R2 #include <Windows.h> #include <stdio.h ...

  2. Hadoop 学习资料集锦

    Hadoop 资料 虾皮系列教程. Sqoop 资料 官方安装文档. 浪迹天涯博客. 瀚海星空博客. ……

  3. The World's Only Advanced Operating System

    The World's Only Advanced Operating System

  4. view的滑动冲突解决方案

    一.常见的滑动冲突场景 1.外部滑动方向和内部滑动方向不一致 2.外部滑动方向和内部滑动方向一致 3.上面两种情况的嵌套 二.滑动冲突处理的原则 场景1的处理原则是:当用户左右滑动时,需要让外部的vi ...

  5. git上传代码到osc@git

    1.get an account 2.get a ssh-key 3.git setting git config --global user.name "...." git co ...

  6. 使用 Graphviz 画拓扑图

    使用 Graphviz 画拓扑图 0)前述 本文着重讲一下 Graphviz 的风格控制,基础一些的就不在这里讲啦. graphviz 的主页是http://www.graphviz.org/. Gr ...

  7. HDU 3584 Cube (三维 树状数组)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=3584 Cube Problem Description Given an N*N*N cube A,  ...

  8. Kafka设计解析(四)- Kafka Consumer设计解析

    本文转发自Jason’s Blog,原文链接 http://www.jasongj.com/2015/08/09/KafkaColumn4 摘要 本文主要介绍了Kafka High Level Con ...

  9. mui框架中底部导航的跳转2

    接上一篇 还有一种方法就是在一心得页面中打开我们所需要的网页 代码如下: 向新的的页面穿值: 获取到新页面上的值:

  10. spring mvc + ehcache 利用注解实现缓存功能

    我的spring是3.1的,因为项目需求,需要在查询时候加上缓存,小白一个,完全没有用过缓存(ehcache),摸索了一天终于会了一点通过注解来使用ehcache进行缓存,立刻给记录下来. 首先 我的 ...