禁用NG-点击，而在股利

拖着我已经启用了扩大和我的小部件已连接到一个拖动directive.This工作正常崩溃。禁用NG-点击，而在股利

问题：

展开和折叠已被添加NG单击事件，所以当用户拖动小工具，并把它NG-点击也被炒鱿鱼。当用户拖动小部件时，我不希望ng-click被解雇。

这里是我的代码：

HTML：

<div plumb-item ng-repeat="widget in dashboard.widgets" ng-style="{ 'left':widget.left, 'top':widget.top, 'width':widget.width }" data-identifier="{{widget.id}}" resizeable> 
    <p ng-if="widget.divider">{{widget.chartConfig.title.text}}</p> 
    <md-card ng-if="!widget.expanded && !widget.divider" ng-click="widget.expanded = !widget.expanded" ng-mouseover="hover = true" ng-mouseout="hover = false"> 
     <md-item layout="row">         
      <div class="collapsed-row" layout="row" layout-align="start center" flex> 
       <div class="md-toolbar-tools"> 
        <h3> 
       <span>{{widget.chartConfig.title.text}}</span> 
       </h3> 
       </div>      
      </div>         
     </md-item> 
    </md-card> 
    <md-card ng-if="widget.expanded && !widget.divider" ng-click="widget.expanded = !widget.expanded"> 
     <div layout="column">         
      <md-card-content> 
       <highchart id="{{widget.id}}" config="widget.chartConfig" ></highchart>       
      </md-card-content> 
     </div> 
    </md-card> 
</div>

JS：

Draggable.JS

routerApp.directive('draggable', function() { 
    return { 
     // A = attribute, E = Element, C = Class and M = HTML Comment 
     restrict:'A', 
     //The link function is responsible for registering DOM listeners as well as updating the DOM. 
     link: function(scope, element, attrs) { 
      console.log("Let draggable item snap back to previous position"); 
      element.draggable({ 
       // let it go back to its original position 

       revert:true 
       }); 
     } 
     }; 
    });

来源

2015-04-23 Sajeetharan

您可以在div拖动完成时添加event.stopPropagation（）。 – Anita

在dragable指令里面？ – Sajeetharan

是的，如果您有任何功能/回调拖动完成功能 – Anita

尝试添加该在你的指令

routerApp.directive('draggable', function() { 
    return { 
     // A = attribute, E = Element, C = Class and M = HTML Comment 
     restrict:'A', 
     //The link function is responsible for registering DOM listeners as well as updating the DOM. 
     link: function(scope, element, attrs) { 

      console.log("Let draggable item snap back to previous position"); 
      element.draggable({ 

       stop:function(event,ui) { 
          console.log("Check if its printing") 
          event.stopPropagation(); 
           }, 

          // let it go back to its original position 

       revert:true 
       }); 
      } 
     }; 
    });

这将停止事件的进一步传播，所以它可能会停止不需要的点击

来源

2015-04-23 12:29:23 Anita

你能提供完整的代码部分，包括我的指令 – Sajeetharan

我已经添加了指令代码，检查是否？？？它可以帮助你 – Anita

它没有为我工作和消息没有打印 – Sajeetharan

我做了一个指令（alClick），这仅仅是NG-点击，但取消所有点击如果按下默认持续时间超过750毫秒。因此，拖动或滑动时不会触发点击或点按事件。

<div al-click="widget.expanded = !widget.expanded"></div>

来源

2015-12-08 18:17:21

这个要求。我喜欢alClick，直到我发现了警告我以前掩饰过，'此指令删除/禁用角度的ng-click。您将无法使用随NG-click.'这是不能接受的我的应用程序（和大多数应用程序，我猜）人点击删除NG单击功能。我希望作者alClick的（@Mohammed A.铝贾马）可以修改它，以便它可以与NG-点击共存！我确信有一种方法，它会使他的软件产品变得更好。 – ryanm

禁用NG-点击，而在股利

回答

相关问题