Templates Angular js指令动态模板绑定

我有一个模板，看起来像：

scope:{
  localClickFunc: "&click",
  myLocalDbClickFunc: "&dblclick"
} ...

 <myButton  ng-click="localClickFunc($event)" ng-doubleckick="myLocalDbClickFunc($event)"/>

范围：{
localClickFunc:“&单击”，
myLocalDbClickFunc:“&dblclick”
} ...

还有许多其他事件（鼠标悬停等）

我的localClickFunc与控制器函数绑定在scope指令中（在我的情况下，它们可以用“=”绑定，这无关紧要）

问题在于，在使用此“myButton”指令时，并非所有属性都是必需的。如果我将其与所有其他事件一起使用，则将通过一个noop函数注册和触发

---

我可以在屏幕上有多达1000个按钮。解决这个问题的办法是什么？。有条件模板吗

u可以发送attr，比如说指令名为mydir，然后在link和compile函数中，第三个参数中的一个通常是names as params，u通过params.mydir到达那里（值将是ovidiu）。您可以发送任何基于文本的内容，如“；”像“click；dbclick；onmouseout”一样分开，并在指令中用params.mydir.split（“；”）将其打断。从那里，您甚至可以转到“allClicks”之类的事件组，您只需要在链接中添加一些字典或开关即可添加正确的内容。

范围绑定定义中的

？

使属性成为可选属性

但是，就角度而言，函数绑定（

&

）始终是可选的。也就是说，如果您没有在此绑定中指定函数，Angular将不会抱怨，并且它将把函数放在指令的范围内。因此，如果（scope.localClickFunc==null）检查其存在，则无法编写

我建议使用可选的绑定
=？
来指定回调。通过这种方式，您将能够检查绑定存在的范围，并且仅当绑定存在时，才能将其绑定到实际的DOM事件。示例代码：

scope:{
    localClickFunc: "=?click",
    localDbClickFunc: "=?dblclick"
},
link: function(scope, element, attrs) {
    ...
    if( scope.localClickFunc != null ) {
        element.on("click", scope.localClickFunc);
    }
    ...
}

然后将指令用作：

<myButton click="localClickFunc($event)"
          dblclick="myLocalDbClickFunc($event)"
/>



您可以指定任何或所有属性，并相应地安装处理程序。
如何将单击时的属性转换为ng单击？为什么要这样做？也许编辑澄清了预期用途。你的意思是。我想要的是有条件地添加指令。我现在看到了compile函数，如果我可以在不影响1000个按钮性能的情况下使用它，那么您还应该研究在列表的父元素中设置单个事件侦听器。此解决方案解决了“如果未指定处理程序，则不设置noop处理程序”的问题。@NikosParaskevopoulos我看到您对angular有经验和兴趣，您能否告诉我，如果切换到元素，我会损失什么。on（'on'）而不是使用angular ng单击？