检测自定义过滤器何时在 AngularJS 中完成 [英] Detect when a custom filter has completed in AngularJS

查看:21
本文介绍了检测自定义过滤器何时在 AngularJS 中完成的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个自定义过滤器函数,我正在调用 ng-repeat 指令:

<div ng-repeat="appVm.appList 中的应用 |filter:appVm.assetFilter>{{app.title}}</div>

这显然会影响到 appList 中每个应用程序的资产过滤器功能.过滤完成后,我想运行另一个函数.

如何检测过滤过程何时完成?

更新

根据指出我其他答案的回复,我可以进一步澄清.

当我使用自定义指令并使用 scope.$last 实现该解决方案时,我观察到以下内容:

  • 当第一次呈现页面并填充列表时,它按预期工作 - 检测到最后一个项目.
  • 当我的过滤器函数被触发并从列表中删除项目时,指令处理程序根本没有被命中.
  • 当相同的项目被重新添加到列表中,但它们不是列表中的最后一个项目时,指令被命中,但仅针对重新添加的项目,并且没有具有范围的项目.$last 为真.

希望这有助于澄清.

解决方案

ng-repeat 为每个重复的元素创建一个作用域.此范围包括 $first$last,因此您可以添加检查这些内容的指令

HTML

指令:

app.directive('checkLast',function(){返回{限制:'A',链接:功能(范围,元素,属性){如果(范围.$last){/* 中继器完成代码*/}}}})

演示

I have a custom filter function I'm calling for ng-repeat directive:

<div ng-repeat="app in appVm.appList | filter:appVm.assetFilter">{{app.title}}</div>

This obviously hits my assetFilter function for each app in the appList. When filtering is complete, I want to run another function.

How can I detect when the filtering pass has completed?

Update

Based on responses pointing me towards other answers, I can clarify a bit further.

When I implement that solution with a custom directive and using the scope.$last, I observe the following:

  • It works as expected when the page is first rendered and the list is populated - the last item is detected.
  • When my filter function is triggered and items are removed from the list, the directive handler is not hit at all.
  • When the same items are the added back into the list, but they're not the last items in the list, the directive is hit, but only for the items being added back in, and there is no item with a scope.$last of true.

Hope this helps to clarify.

解决方案

ng-repeat creates a scope for each repeated element. This scope includes $first and $last so you can add a directive that checks for these

HTML

<div ng-repeat="item in items"  check-last>

Directive:

app.directive('checkLast',function(){
  return{
    restrict:'A',
    link:function(scope,elem,attrs){
      if(scope.$last){
            /* repeater done code*/
      }
  }
  } 
})

DEMO

这篇关于检测自定义过滤器何时在 AngularJS 中完成的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆