Отключить ng-Click при перетаскивании по Div

Question

Я включил развернуть и свернуть с моим виджетами, прикрепленным к перетаскиваемой директиве. Это работает отлично.

ВОПРОС:

расширяемые и коллапс был добавлен в нг щелкните событие, поэтому, когда пользователь перетаскивает виджет и падение его нг кнопки мыши и увольняют. Я не хочу, чтобы 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 
       }); 
     } 
     }; 
    }); 

Answer 1

Попробуйте добавить это в вас директива

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 
       }); 
      } 
     }; 
    }); 

Это останавливает дальнейшее распространение событий, так что он может остановить нежелательную нажмите

Answer 2

Я сделал директиву (alClick), который просто нг щелчок, но аннулирует щелчок если продолжительность печати превышает 750 мс по умолчанию. Поэтому при перетаскивании или прокрутке события при нажатии и нажатии не срабатывает.

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