1

我已经创建了一个指令，但我不太确定像element.bind("click", function(){}). 每个指令的链接函数被多次调用，每次调用都会产生一个重复的绑定。实现这一点的最 Angular 方式是什么（甚至点击绑定也可以作为属性使用）？

var globalCounter = 0;
app.directive("myDirective", function()
{
    return {
       link: function(scope, element) {
          globalCounter++;
          $(element).bind("click", function () {});
       }
    }
});

每次我将 ng-view 更改为不同的模板时，globalCounter 变量（和点击绑定？）都会增加。

也许元素被破坏并与之绑定，我不确定，也许这就是我的答案。

4

4 回答 4

1

我认为您可以设置一个限制配置选项

首先，我们正在设置限制配置选项。限制选项用于指定如何在页面上调用指令。

正如我们之前看到的，有四种不同的方式来调用指令，因此有四种有效的限制选项：

'A' - <span ng-sparkline></span>
'E' - <ng-sparkline></ng-sparkline>
'C' - <span class="ng-sparkline"></span>
'M' - <!-- directive: ng-sparkline -->

http://www.ng-newsletter.com/posts/directives.html

于 2013-09-24T11:00:19.430 回答
1

您没有将计数器放在点击事件中。此外，对于具有指令的元素，您不需要 jQuery 选择器。

app.directive("myDirective", function()
{
    return {
       link: function(scope, element, attrs) {
          element.bind("click", function () {
             // Click event here
          });
       }
    }
});
于 2013-09-24T11:02:33.917 回答
1

你的假设并不完全正确。每个指令声明都会调用一次指令链接函数。所以点击的元素是不同的。因此，每个功能都作用于不同的控件。

您仍然可以执行基于 css 选择器的单击操作绑定，但是应该在父级上定义该指令。

此外，当视图更改时，DOM 将被破坏，因此您的旧绑定将被删除。

于 2013-09-24T11:09:19.167 回答
0

我写了这个贬义的小例子https://github.com/JTOne123/angularJs.elementReady/blob/master/src/onElementReady.js 并在这里修复了一些范围问题

于 2013-12-12T14:01:13.930 回答