Question

我有一个角度过滤器，它通过某个全局变量的值格式化其输出。那个可以异步改变，过滤器的结果也是如此。但是，结果不会呈现到视图中。不在$apply()甚至$scope上调度事件$rootScope，将强制视图呈现此过滤器的新输出。

对我来说，似乎因为过滤器输入在整个时间内保持不变，因此angular不会调用过滤器自己的方法（我猜这种优化）。

这是一个带有最小演示的plunker：

https://plnkr.co/edit/aUm0XRzWn1qr8ZFZB2sY?p=preview

通过将filter封装在方法内（在控制器或$ scope上）有一种解决方法，它会在每次重绘时呈现。但它迫使我在视图中需要使用此过滤器的每个控制器中重新声明此方法。

是否有人也使用过滤器遇到此限制？

这种情况发生在我从1.2.x到1.5.x测试过的每个角度版本中

Answer 1

问题可以通过状态过滤器来解决。

来自文档：

有状态过滤器

强烈建议不要编写有状态的过滤器，因为Angular会优先执行这些过滤器，这通常会导致性能问题。只需将隐藏状态作为模型公开并将其转换为过滤器的参数，就可以将许多有状态过滤器转换为无状态过滤器。

如果您确实需要编写有状态过滤器，则必须将过滤器标记为$stateful，这意味着它将在每个$digest周期内执行一次或多次。

- AngularJS Developer Guide -- Stateful filters

JS

app.filter('myFilter', function() {
  function myFilter() {
      return someValue
  }
  //Set filter to $stateful
  myFilter.$stateful = true;
  //
  return myFilter;
})

DEMO on PLNKR

Answer 2

或者，如果您不想使过滤器具有状态，您可以使用服务你注入过滤器和控制器。（当你想要在任何东西和任何东西之间共享任何数据时，这在角度上几乎是标准的） https://plnkr.co/edit/GUth5licV3ubLUf2maTV?p=preview

.factory('testService', function(){
  return { 
    someValue : 'This is not right',
    update : function(str){ this.someValue = str; }
  };
})

.filter('myFilter', function( testService ) {
  // Your problem is that this function "lives on" the way it was created
  return function() {
    return testService.someValue;
  }
})

.controller('myController', function($scope, $filter, testService) {
  testService.update( 'This is OK');

  $scope.myMethodCallingMyFilter = function() {
    return $filter('myFilter')();
  };
})

输出更改后，角度过滤器不会在视图中呈现

2 个答案:

有状态过滤器

JS