如何停止AngularJS中自定义指令的ng-click？

发布时间：2020-12-17 17:48:58 所属栏目：安全来源：网络整理

导读：LIVE DEMO 考虑以下myButton指令： angular.module("Demo",[]).directive("myButton",function() { return { restrict : "E",replace: true,scope: { disabled: "=" },transclude: true,template: "div class='my-button' ng-class='{ "my-button-disabled

LIVE DEMO

考虑以下myButton指令：

angular.module("Demo",[]).directive("myButton",function() {
  return {
    restrict : "E",replace: true,scope: {
      disabled: "="
    },transclude: true,template: "<div class='my-button' ng-class='{ "my-button-disabled": disabled }' ng-transclude></div>",};
});

可以像这样使用：

<my-button disabled="buttonIsDisabled" 
           ng-click="showSomething = !showSomething">
  Toggle Something
</my-button>

当buttonIsDisabled为true时,如何停止执行ng-click？

PLAYGROUND HERE

解决方法

为什么不使用按钮的实际按钮.您可以将指令更改为：

angular.module("Demo",template: "<button class='my-button' ng-class='{ "my-button-disabled": disabled }' ng-disabled='disabled' type='button' ng-transclude></button>"
  };
});

然后将它设计为看起来像你的div.见我制作的Short Example.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!