Dai*_*Lim 13 html javascript angularjs angularjs-directive
我不知道为什么会多次调用它.
<!doctype html>
<html ng-app="HelloApp">
<body>
<test-directive></test-directive>
</body>
</html>
angular.module('HelloApp', [])
.directive('testDirective', function () {
return {
restrict: 'E',
replacement: true,
template: '<div ng-class="test()">Test Directive</div>',
link : function (scope, element, attrs) {
console.log('link');
var cnt = 0;
scope.test = function () {
cnt += 1;
console.log('test', cnt);
//element.append('<h6>test' + cnt + '</h6>');
}
}
}
});
Run Code Online (Sandbox Code Playgroud)
控制台结果是
link
test 1
test 2
test 3
Run Code Online (Sandbox Code Playgroud)
这是JSFIDDLE:http://jsfiddle.net/yh9V5/ 打开链接并查看console.log
在摘要周期运行时,您在AngularJS中使用的所有表达式都会被多次评估.这是为脏检查完成的,它验证表达式的当前值是否与最后一个值不同.
这意味着如果在表达式中使用方法,则不能依赖于调用方法的次数.
请参阅"范围生命周期"部分以了解它是如何发生的http://docs.angularjs.org/guide/scope
AngularJS 编译 DOM,因此它可能会在幕后创建div并执行几次。ng-class无论如何,ng-class预计将以另一种方式使用http://docs.angularjs.org/api/ng.directive:ngClass