Angularjs：为啥 1 个绑定有 3 个观察者？
Posted
技术标签:
【中文标题】Angularjs：为啥 1 个绑定有 3 个观察者？【英文标题】：Angularjs: why there are 3 watchers for 1 binding?Angularjs：为什么 1 个绑定有 3 个观察者？ 【发布时间】：2017-02-20 21:13:19 【问题描述】：请看下面的截图
如您在上面的屏幕截图中所见，单个绑定有 #3 个观察者。
谁能详细说明为什么会这样？
P.S：我正在使用 AngularJS Batarang 来检查性能。
var app = angular.module('app', []);
app.controller('appCtrl', function ($scope, $timeout)
$scope.name = 'vikas bansal';
)<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script src="app.js"></script>
</head>
<body>
<div ng-app="app" ng-controller="appCtrl">
name
</div>
</body>
</html>【问题讨论】：
【参考方案1】：我认为 Angular Batarang 有一个错误的观察者计数器。我检查了几个不同的来源，除了 AngularJS Batarang 之外的所有来源都向我展示了你的代码的单一观察者。看看这个question 的功能：
(function ()
var root = angular.element(document.getElementsByTagName('body'));
var watchers = [];
var f = function (element)
angular.forEach(['$scope', '$isolateScope'], function (scopeProperty)
if (element.data() && element.data().hasOwnProperty(scopeProperty))
angular.forEach(element.data()[scopeProperty].$$watchers, function (watcher)
watchers.push(watcher);
);
);
angular.forEach(element.children(), function (childElement)
f(angular.element(childElement));
);
;
f(root);
// Remove duplicate watchers
var watchersWithoutDuplicates = [];
angular.forEach(watchers, function(item)
if(watchersWithoutDuplicates.indexOf(item) < 0)
watchersWithoutDuplicates.push(item);
);
console.log(watchersWithoutDuplicates.length);
)();
您可以查看Watchers chrome 扩展名。两者都显示 1 个观察者。
【讨论】：
以上是关于Angularjs：为啥 1 个绑定有 3 个观察者？的主要内容，如果未能解决你的问题，请参考以下文章
为啥我不能在angularjs中以两种方式绑定指令组件具有相同的名称？