为什么还是filter和orderBy的优点呢?

2024-05-30

看来 AngularJS 确实非常重视在视图中使用过滤器和其他 ng 指令来过滤和排序数据,而不是在模型中手动执行。这有什么原因吗?比如速度更快、有缓存还是其他原因?

例如,我想显示一个已排序的列表,但我也想访问已排序的列表以用于与视图无关的其他目的。如果列表直接在模型中排序,则非常容易,因此我试图了解这样做是否有缺点。

Thanks!


如果对您有意义的话,我不认为对数据进行预排序有什么问题,但这里有一些使用 Angular 过滤器的优点和缺点。

Pros:

  • 视图和模型清晰分离。模型/控制器不需要知道或包含与如何显示/排序/过滤数据相关的代码
  • 由于过滤器是在模型改变时执行的按过滤器排序 http://docs.angularjs.org/api/ng.filter:orderBy通过 UI 将项目添加到数组时可以自动排序
  • 过滤器可用于格式化数据以供显示(货币过滤器 http://docs.angularjs.org/api/ng.filter:currency例如)以及修改 DOM 添加/删除项目(过滤器 过滤器 http://docs.angularjs.org/api/ng.filter:filter例如)不修改底层模型数据
  • 促进常用内置或custom http://docs.angularjs.org/guide/dev_guide.templates.filters.creating_filters过滤功能

Cons:

  • 过滤函数编写得不好可能会导致性能问题。您可以在中看到一个故意设计的示例AngularJS Batarang 视频 http://blog.angularjs.org/2012/07/introducing-angularjs-batarang.html4:30 开始。任何代码(不仅仅是过滤器)都可能写得不好,但过滤器被调用的频率最初并不明显。
  • 有点令人困惑,因为有些过滤器作用于单个数字/字符串(货币过滤器),有些过滤器作用于数组(orderBy 过滤器)
  • 传递参数和过滤器链接的语法也可能有点令人困惑

我确信还有更多优点/缺点,但希望这会有所帮助!

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

为什么还是filter和orderBy的优点呢? 的相关文章

  • Chrome开发者工具中不显示cookie

    i am using node express server and angularjs as frontend server sets the cookie and is shown correctly in the network re
  • NG 重复后运行指令

    因此 我希望尽可能将我的插件库移至 Angular 以保持一致性 我遇到的问题是在其子级的任何指令运行后获取要运行的指令 只是为了澄清一点 这里的目标是让我们的集成商 仅限 CSS HTML 团队成员 轻松地通过使用功能标记来向项目添加动态
  • 无法在简单的 Yeoman Angular 上使用 grunt

    尝试使用本指南中的步骤通过 Yeoman 启动一个简单的角度应用程序http www sitepoint com kickstart your angularjs development with yeoman grunt and bowe
  • 如何阻止在文本框中输入电子邮件地址或显示弹出窗口?

    我需要一个textbox在我的表单中输入电子邮件地址 但地址应该是企业电子邮件 决不允许输入个人gmail or yahoo这样做时解决或显示警告弹出窗口 如何实现 我可以使用angulars ng pattern来实施吗 你可以做这样的事
  • 如何使用 AngularJS 设置页面标题[重复]

    这个问题在这里已经有答案了 我使用以下代码来显示每个 AngularJS 应用程序模板的页面标题 但每当我尝试输入无效的 URL 来测试 otherwise 时 我都会收到以下错误 TypeError Cannot read propert
  • 如何克隆 Angular UI 树中的节点?

    如何克隆 Angular UI 树中所有子节点的节点 现在我使用事件点击 ng click newSubItem this where newSubItem是函数 scope newSubItem function scope var no
  • 奇怪的 Angular-ChartJS 问题,在 Ionic App 中无法正确显示

    我正在使用 AngularJS 构建一个 Ionic 应用程序 在此应用程序中 我想要一个数据折线图 昨天我问了一个关于这个的问题 Angular Chart 不渲染任何内容 https stackoverflow com question
  • Angular 中的动态标签生成

    我正在尝试使用包含一堆指令名称的数组动态生成表单 scope components textbox textbox radio checkbox label 我想使用 Angular 生成具有这些名称的标签 例如
  • 使用 $http 拦截器取消请求?

    我想弄清楚是否可以使用 http拦截器在请求发生之前取消请求 有一个按钮可以触发请求 但如果用户双击它 我不希望相同的请求被触发两次 现在 我意识到有几种方法可以解决这个问题 并且我们已经有了一个可行的解决方案 我们将其包装起来 http在
  • Angularjs ui 路由器。如何重定向到登录页面

    我有4个状态 仪表板 仪表板 main 仪表板 次要 login 仪表板是抽象的 它是 minor 和 main 状态的父状态 下面是我的代码 state dashboard url dashboard abstract true temp
  • AngularJS 控制器内的函数

    我有一个代码片段 其中有一个 Angular 模块化控制器 但同一控制器内有一个函数并带有一个调用 这让我怀疑 Javascript 或 Angular 是否允许这种编码方式 如果是 那么它如何读取它 请参阅我的以下代码格式 obj con
  • 在 AngularJS 应用程序中使用 select2 插件

    我在 AngularJS 应用程序中使用 select2 插件来显示一些实体 标签 的列表 这是我的模板的部分 select ddlTags ui select2 select2Options multiple ng model link
  • 不使用 data-* 前缀的自定义 HTML 属性是否有效? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 量角器中的“$”选择器

    我见过很多这样的例子 selector 我也在用这个 那么这又是什么 变量确实如此 这是我从量角器得到的docs https angular github io protractor api view ElementFinder proto
  • 选项卡集 $rootScope 范围未更新

    我的屏幕结构如下 UserExperienceScreen
  • 更改 Angular 模型以更新 Kendo

    我一直在一个项目中使用 Angular 最近才发现 Kendo Angular 项目位于http kendo labs github io angular kendo http kendo labs github io angular ke
  • Angular 1 到 Angular 5(导入嵌套组件)

    Before 角度1 5 用户界面路由器 Now 角5 0 如何在像 Angular 1 5 这样的组件父组件中导入子组件 我从 Angular 5 开始制作教程 Heroes 但没有解释这个过渡 所有组件都导入到 app modole t
  • 路由和干净路径(无主题标签)在 angularJS 中不起作用

    伙计们 这让我发疯了 我为此奋斗了几个小时 却找不到解决方案 我知道为了从 URL 路径中清除主题标签 我需要使用 locationProvider html5Mode true 但由于某种原因 这对我来说效果不佳 我使用 tomcat 7
  • 如何在 ionic 应用程序中使用 socket.io

    我正在使用 ionic 创建一个应用程序cordova and angular 我必须使用 IP 地址和端口号发出请求 到插座 我读过有关 socket io 的内容 我对如何安装感到困惑套接字 io以及如何与 Angular JS 和 N
  • AngularJS 应用程序:如何将 .js 文件包含到 index.html 中

    我是 angularJS 的新手 我设法使用 AngularJS 构建了一个phonegap应用程序 该应用程序正常并且运行良好 问题是 现在我对 angularJS 的工作原理有了更多的了解 至少我认为我已经了解了 我担心我的应用程序文件

随机推荐