1
每個指令是否有一個額外的監視器? 以下是示例代碼 - http://plnkr.co/edit/Mg4Z7PUUJI0dQRNfFZ8z?p=preview 它有4個自定義指令與一次性綁定,但我有5個觀察者,應該只有1個。 爲什麼?一個指令=一個額外的觀察者?
angular.module("myApp", [])
.controller("initCtrl", function ($scope, $interval) {
$scope.dane = {
zm1: 'Directive 1 with onetime binding',
zm2: 'Directive 2 with onetime binding',
zm3: 'Directive 3 with onetime binding',
zm4: 'Directive 4 with onetime binding',
};
$interval(function() {
$scope.watchers = countWatchers();
}, 1000);
})
.directive("myDir", function() {
return {
scope: {
ngModel: "="
},
require: "ngModel",
link: function (scope, element, attrs, ctrl) {
},
template: "<div>{{::ngModel}}</div>"
}
})
;
/**
* Funkcja do zliczania watchers - max 2000
*/
(function() {
window.countWatchers = 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);
}
});
return watchersWithoutDuplicates.length;
};
})();
<!DOCTYPE html>
<html>
<head>
<script data-require="[email protected]" data-semver="1.3.6" src="https://code.angularjs.org/1.3.6/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body data-ng-app="myApp">
<div ng-controller="initCtrl" class="container">
<div class="well">Watchers: {{watchers}}</div>
<my-dir ng-model="::dane.zm1"></my-dir>
<my-dir ng-model="::dane.zm2"></my-dir>
<my-dir ng-model="::dane.zm3"></my-dir>
<my-dir ng-model="::dane.zm4"></my-dir>
</div>
</body>
</html>