Question

http://jsfiddle.net/V9sYB/50/

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<div ng-app>
  <div ng-controller="SomeCtrl">
      <input ng-model="textProperty"/>      
      <span>{{computedProperty()}}</span> 
  </div>
</div>

脚本

function SomeCtrl($scope) {
  $scope.textProperty = "initial";
    var times = 0;
    $scope.computedProperty = function(){
        console.log(++times);
        return $scope.textProperty+ " asdf";
    };
}

有没有办法避免/解决Angularjs计算属性每次运行两次？

或者我是否必须为那些我永远不会在另一个控制器上重复使用的指令编写指令？

Answer 1

当您使用{{插值时，您实际上是在其内部的表达式上创建一个监视。由于angularjs适用于脏检查主体，因此在摘要周期中多次重新评估表达式时，无法控制在插值中定义的任何表达式运行的次数。

因此，这样的计算属性\方法应该没有副作用，因为它被多次调用，而你作为开发人员无法控制。

Answer 2

如果视图表达式计算量很大，建议使用某种函数缓存机制，以降低成本。

例如，可以使用下划线实用程序带中的大量memoization方法轻松缓存您的函数：

FIDDLE

function SomeCtrl($scope) {
  $scope.textProperty = "initial";
  var memoizedTimes = 0;
  $scope.computedMemoizedProperty = _.memoize(function(){
    console.log(++memoizedTimes);
    return $scope.textProperty + " asdf";
  }); 
}

这确保了对于每个输入，函数逻辑总是最多执行一次。

有没有办法避免/解决Angularjs计算属性每次运行两次？

2 个答案: