破坏我的代码的角度1.3发生了什么变化?

时间:2014-11-07 16:34:00

标签: angularjs

我的代码在Angular 1.2中工作,但在1.3中不起作用,我无法弄清楚角度有什么变化以及我应该在我的代码中修改它来修复它。

我已经设置了plunkr example

HTML中的代码只是

{{ 'guy' | change }}

javascript代码为:

angular.module('app').service('MyService', function( $timeout ){

  var data = null;

  $timeout(function(){
     data = 'this is data';
  },2000);

  this.transform = function(){
    return data;
  }

});


angular.module('app').filter('change', function( MyService ){
  return function(input){
    return MyService.transform();
  }
});

这个想法是过滤器的结果取决于异步响应。

在Angular 1.2中,视图相应更新。在Angular 1.3中它没有。

要在角度1.2和角度1.3之间切换,您需要将路径更改为HTML文件顶部的角度。之间

<script data-require="angular.js@1.3.0" data-semver="1.3.0" src="//code.angularjs.org/1.3.0/angular.js"></script> 

和这个

<script data-require="angular.js@1.2.0" data-semver="1.2.0" src="//code.angularjs.org/1.2.0/angular.js"></script>

我也试过1.3.1 - 同样的问题。

1 个答案:

答案 0 :(得分:6)

这是由于自1.3.0-rc2以来引入的优化。

基本上,$parse服务对输入执行脏检查,并且只有在至少有一个输入已更改时才重新计算表达式。在您的示例中,表达式的唯一输入的文字&#39; guy永远不会更改,因此包括过滤器在内的整个表达式不会被重新评估。这意味着过滤器应该是无状态的,为相同的输入返回相同的结果。

假设您已了解并接受性能损失,您可以通过告知AngularJS您过滤有状态来绕过此优化,如下所示:

angular.module('app').filter('change', function( MyService ){
  var fn = function(input) {
    return MyService.transform();
  }
  fn.$stateful = true;
  return fn
});

这是新的plunkr,可以按照您的预期运作。