Angular.js - 使用$ watchCollection绑定要监视的模型的性能影响

时间:2015-04-27 23:47:16

标签: javascript angularjs performance

我试图更好地了解新的代码库,并且找不到有关性能影响的大量信息(或者我可能还没有完全理解我所阅读的内容)做出的一些选择。以前的维护者无法获得洞察力。

每个控制器都设置为在最初使用此模式呈现之前发出数据请求:

$routeProvider.when('/path', { resolve: { someMethod: function($q) { var deferred = $q.defer(); .... do some stuff ... return deferred.promise; } });

然后将其注入控制器 - 该部分是有意义的,并且从我的理解中更有效率,因为您通过等待数据首先通过来保存摘要。默认情况下会显示加载状态,并在我们消化时删除。

然后将注入的参数的值(在这种情况下为someMethod - 分配给this.someModel

在整个控制器中,使用this.doStuff = function() { ... }this.property = 'some string'等设置剩余的方法和属性。

最后,设置了一个手表,通过设置$scope这样的$watchCollection可以使用属性:

$scope.$watchCollection(angular.bind(this.someModel, function() {
    return this;
}), function(newTitle, oldTitle) {
    if (newTitle.title !== oldTitle.title)
    {
        self.updateThings(newTitle);
    }  
});

我理解它将手表的上下文绑定到this的当前上下文,然后使用$watchCollection观察其属性的更改,这将对其顶部执行浅层参考检查级别属性。

this article我得到的仅仅是使用{{ property }}模板中的属性会导致他们被观看,但在这种情况下,他们不会被观看直到他们被绑定到$ watchCollection。

当然这比使用$watch并将true传递给可选对象相等参数更便宜,但从性能角度来看,它比直接放到{{1}上更好或更差}?为什么,特别是?

我以前从未见过这样做过,所以任何能够让我更好理解的读物,见解或事物都会受到高度赞赏。

1 个答案:

答案 0 :(得分:1)

我能想到的唯一真实的是作者希望将所有内容直接保留在作用域之外,只填充控制器实例的属性,这些属性将通过controllerAs中指定的属性在作用域上可用路径定义对象上的属性。

然而,当这样做时,如果你想在范围上设置$watch es以通知某些事情的变化,你就不能,因为你实际上并不知道它将在哪个范围内出版。

}而不是真正关心控制器代码本身。但如果你做出了让步,你可以改用vm

最后一个可能的原因是ctrlcontrollerAs最终总是最终处理一个函数,因为它们用来获取摘要期间正在监视的事物的值。如果您传递一个字符串,它会使用封面下的$scope.$watchCollection('vm.someModel', ...服务将其转换为函数。如果直接传递函数,则不需要转换,因此可以将其视为性能的微小改进。

真正的原因可能是一个,全部或全部,但它们是采用这种方法的正当理由。我真的很佩服它的纯洁性和严格遵守"控制器作为",这是目前Angular团队和社区鼓励的时尚策略。