我写过这个例子hover counter指令在angularjs中。它可以工作,并将秒数写入控制台。它呈现“悬停我0”,但在计数时不更新数字。定时器计数器指令
angular.directive('countHoverTime', function() {
return {
link: function(scope, element, attributes) {
scope.seconds = 0;
var ticking = false;
var tickTock = function() {
scope.seconds++;
console.log('tick');
if (ticking) {
window.setTimeout(tickTock, 1000);
}
}
$(element).hover(function() {
console.log('Hover In');
scope.seconds = 0;
ticking = true;
tickTock();
}, function() {
console.log('Hover Out');
ticking = false;
console.log("Seconds: " + scope.seconds);
});
}
};
});
和HTML
<p count-hover-time>Hover me! {{ seconds }} </p>
我喜欢apairet关于angularizing的评论,而不是jquery for .hover,但是我仍然需要调用scope。$ apply()来完成dom更新。 – linojon 2014-10-01 22:33:20