Angular:范围变量与函数

时间:2014-06-08 14:32:24

标签: angularjs data-binding

Angular中更好的东西 - 绑定到变量或函数。特别是:

  • 是否因为摘要调用或为函数创建的其他监视而导致性能下降?
  • 是否有关于范围功能应该和不应该做什么的建议?

两个选项的示例:

<!-- With function -->
<button ng-disabled="noDataFoo()">Add</button>

<!-- With variable -->
<button ng-disabled="noDataFlag">Add</button>

支持控制器:

app.controller('sample', function($scope, $http) {
    $scope.noDataFlag = true;

    $scope.noDataFoo = function () {
        return !$scope.data;
    };

    $http('/api/getdata').success(function(data) {
        $scope.data = data;
        $scope.noDataFlag = false;
    };
});

2 个答案:

答案 0 :(得分:2)

我不是一个javascript性能专家或者其他任何东西,但是我天真的意见是变量会在几个纳秒之后执行函数,因为它是一个两步过程。

此外,上面的示例使用:

也很容易实现
<button ng-disabled="!data">Add</button>

答案 1 :(得分:2)

我做了一些测试并计算了在不同情况下调用函数的次数。它发生了,该函数被称为绑定次数,有时是数字的两倍,似乎在每次外部活动之后发生,如页面重新加载或按钮点击或AJAX电话。

简单来说,如果您在HTML中有<button ng-disabled="noDataFoo()">然后{{noDataFoo()}},那么在页面加载时该函数将被调用4次,如果有$http次服务则会再调用2次或4次带来数据,如果点击其他按钮,则再带2到4次。根据实验,如果noDataFoo没有变化,则数字为2;如果变化,则数字为4。顺便说一句,同样适用于另一个控制器的点击。

我的结论是:可以绑定到快速功能。对于较长的那些,保持较小的绑定数量会更好。对于更长时间的人来说,更快速地缓存结果并手动处理&#34;缓存更新。