【问题标题】:Angular filter not render in view after output changed输出更改后角度过滤器不在视图中呈现
【发布时间】:2016-06-28 22:40:46
【问题描述】:

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

对我来说,似乎因为过滤器输入始终保持不变,角度不会调用过滤器自己的方法(我猜是那里的优化)。

这是一个简单的演示:

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

有一种解决方法是在方法(在控制器或 $scope 上)封装过滤器,该方法将在每次视图重绘时呈现。但这迫使我在需要使用此过滤器的视图上的每个控制器中重新声明此方法。

有没有人也遇到过这个过滤器的限制?

这发生在我从 1.2.x 到 1.5.x 测试的每个 Angular 版本中

【问题讨论】:

  • 可以使用服务

标签: angularjs filter


【解决方案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

【讨论】:

    【解决方案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')();
      };
    })
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2018-04-02
      • 1970-01-01
      • 1970-01-01
      • 2023-01-13
      • 1970-01-01
      • 1970-01-01
      • 2019-07-18
      相关资源
      最近更新 更多