dir-pagination 指令 angularjs :有什么方法可以获取分页中当前页面的所有记录吗?

2023-11-24

我正在使用 @michaelbromley 的 dir-pagination 指令。我想获取指令当前页面上的所有记录。有什么办法可以做到这一点吗?

dir-paginate pic

链接在这里:目录分页,所以我需要 5 个集合records从100到96。有什么快速的方法吗?

我尝试了几件事但没有成功。


我遇到了同样的问题,但这里的答案没有满足我的需求(或者可能想要)。我决定自己解决这个问题,并决定创建一个过滤器,其唯一目的是在给定目标的给定属性中记录通过它的项目。我想出了这个:

/**
 * Author: Eric Ferreira <http://stackoverflow.com/users/2954747/eric-ferreira> ©2015
 *
 * This filter will sit in the filter sequence, and its sole purpose is to record 
 * the current contents to the given property on the target object. It is sort of
 * like the 'tee' command in *nix cli.
 */
angular.module('app').filter('record', function() {
    return function(array, property, target) {
        if (target && property) {
            target[property] = array;
        }
        return array;
    }
});

然后,您在分页中使用过滤器(或者您想要实际获取当前数组的任何地方[想想,在使用搜索查询过滤之后、分页之后、过滤当前页面之后等等]),如下所示:

<div dir-paginate="item in items | itemsPerPage:pageSize | record:'currentPage':this">{{item.text}}</div>

您还可以在一个序列中多次使用它:

<div dir-paginate="item in items | filter:searchQuery | record:'filtered':this | itemsPerPage:pageSize | record:'currentPage':this">{{item.text}}</div>

上面将记录当前页面和当前过滤查询结果的所有记录。

这将记录(并在更改时更新)当前页面$scope.currentPage. The this上例中是过滤器的目标。它决定$scope.this对于大多数意图和目的来说,这只是$scope.

在您的特定情况下,您可以使用此行(在模块中添加/需要过滤器之后)来代替分页:

<li dir-paginate="meal in perman  = ( meals | filter:q ) | orderBy: order?'key':'-key' | itemsPerPage: pageSize | record:'currentPage':this">{{ meal.key + ': ' +meal.val }}</li>

我继续分叉你的插件来展示它也可以工作:

http://plnkr.co/edit/uC3RiC?p=preview

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

dir-pagination 指令 angularjs :有什么方法可以获取分页中当前页面的所有记录吗? 的相关文章

  • 在解决承诺之前已提交指令

    我在获取指令时遇到问题 仅在我的承诺得到解决后才呈现其内容 我想then 本来应该这样做 但它似乎不起作用 这是我的控制器 Generated by CoffeeScript 1 6 3 function var sprangularCon
  • 如何使用 AngularJS 设置页面标题[重复]

    这个问题在这里已经有答案了 我使用以下代码来显示每个 AngularJS 应用程序模板的页面标题 但每当我尝试输入无效的 URL 来测试 otherwise 时 我都会收到以下错误 TypeError Cannot read propert
  • 更新 Angularjs 和 Momentjs 中的“时间之前”值

    原文 我有一个用 ng repeat 生成的表 其中包含数百个条目 其中包含几个不同的 unix 时间戳 我使用 moment js 让它们显示为 19 分钟前 或无论多久之前 例如 我如何每五分钟更新一次 而不必刷新整个表 这需要几秒钟并
  • 使用 ngSanitize 在 HTML 中注入“ng-click”

    我正在使用 Angular 进行本地化 但我遇到了最后一件事 我有这个 json blob key need to login value You need to a log in a to add an event description
  • Angular 2 — 浏览网页,无需重新加载这些页面常用的组件

    您可以在这里找到一个示例应用程序 http ivan khludov com http ivan khludov com 这是我的根组件 import Component from angular core Component select
  • AngularJS ngRepeat:如何区分偶数/奇数元素?

    我是角度新手 并尝试执行以下操作 tr div td class even a href element a td div div td class odd a href element a td div tr 对于上面的代码 两者ng i
  • Angular 中的动态标签生成

    我正在尝试使用包含一堆指令名称的数组动态生成表单 scope components textbox textbox radio checkbox label 我想使用 Angular 生成具有这些名称的标签 例如
  • 用模板替换 ng-include 节点?

    对角度有点陌生 是否有可能replace包含模板内容的 ng include 节点 例如 与 div div src div div 生成的html为 div div src div div
  • 角度2:语法错误:意外的标记<(...)

    我知道 这个问题已经被问过 但我找不到适合我的特定情况的解决方案 我无法理解错误的真正原因 我有一个运行良好的 angularjs2 应用程序 现在我想导入marked图书馆 我做了什么 npm install marked tsd ins
  • 不使用 data-* 前缀的自定义 HTML 属性是否有效? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • Yeoman“grunt 测试”在干净的项目上失败,“端口已在使用中”

    With 苹果操作系统 10 8 4 节点 0 10 12 npm 1 3 1 grunt cli 0 1 9 哟1 0 0 rc 1 凉亭0 9 2 电子邮件受保护 cdn cgi l email protection 我在清理时遇到以下
  • 从不同的控制器修改 $rootscope 属性

    在我的 rootscope 中我有一个visible控制 div 可见性的属性 app run function rootScope rootScope visible false HTML 示例 section section
  • AngularJS:从控制器内读取路由参数

    如何在 AngularJS 控制器中读取 URL 中的参数 假设我有一个像这样的网址http localhost var value我希望将该值存储在控制器内的变量中 var value URL 我尝试过使用 routeParams val
  • 使用像 angularjs 这样的框架对可访问性有什么影响?

    我们的立场 我们正在推动网络可访问性 以便遵守管理公共 教育机构的某些法律 到目前为止 我们一直在确保 我们的布局是按逻辑顺序排列的 图像有alt 标签 但很快我们就意识到我们需要行动起来并认真思考这个问题 我们正在考虑什么 我们一直在关注
  • Angularjs UI 模态表单

    我曾经使用引导模式有一个登录对话框 scope loginDialog backdrop true keyboard true windowClass modal loginDialog backdropClick true templat
  • Spring 和 Angular JS

    我正在使用 Spring 和 Angular JS 开发一个应用程序 但我不知道我所做的是否正确 在同一个 Maven 项目中 我做了 一个用户类 然后我创建了一个 RestController 在其中创建了我的 webservice 在
  • angular.js - 欧洲表示法中的十进制数字

    在 Angular 中 您可以使用货币过滤器来格式化数字 如下所示 service price currency 标准输出是 0 00 输出如何 0 00 欧洲符号 角支撑i18n位置标准 全球化 国际化 当涉及到数字格式时 Angular
  • AngularJS Youtube 播放器嵌入非常大的播放列表

    我目前正在构建一个 AngularJS 应用程序 我知道它有点过时 但我对它很有信心 我的应用程序需要嵌入一个 YouTube 播放器 其中包含一个非常大的播放列表 大约 1500 个项目 但我无法对其进行编码 以便它实际上可以嵌入超过 2
  • Typescript:$rootScope 上不存在属性(Angularjs)

    在 Typescript 中向根作用域添加值时出现错误 class TestClass this rootScope ng IRootScopeService constructor rootScope this rootScope roo
  • 如何在一页/url 上执行 angularjs 多步骤/向导表单

    我试图找出 AngularJS 中合理的方法来创建一个由多个步骤 即向导 组成但链接到一个页面 URL 的函数 来自一个步骤的数据必须将数据发送到下一步 或与之共享数据 要点是 url 应保持不变 即http mydomain myapp

随机推荐