JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<div ng-controller="DropdownCtrl">
    <table>
        <tr ng-click="clicked('row')">
            <td>
                <!-- Single button -->
                <div class="btn-group">
                  <button type="button" class="btn btn-default dropdown-toggle">
                    Action <span class="caret"></span>
                  </button>
                  <ul class="dropdown-menu" role="menu">
                    <li ng-repeat="choice in items">
                        <a href="" ng-click="clicked('link element', $event)">{{choice}}</a>
                    </li>
                  </ul>
                </div>
            </td>
        </tr>
    </table>
</div>

CSS

table {
    width: 100%;
}

tr {
    background-color: #f00;
}

JavaScript

var myApp = angular.module('myApp', []);

myApp.directive('dropdownToggle', ['$document', '$location', function ($document, $location) {
  var openElement = null,
      closeMenu   = angular.noop;
  return {
    restrict: 'CA',
    link: function(scope, element, attrs) {
      
    }
  };
}]);

myApp.config(function($provide){

  $provide.decorator('dropdownToggleDirective', [
      '$delegate', 
      '$document', 
      function ($delegate, $document) {

        var directive = $delegate[0];
        var openElement = null;
        var closeMenu = angular.noop;

        directive.compile = function(){
          return function(scope, element, attrs) {
              console.log('My');
              scope.$watch('$location.path', closeMenu);
              element.parent().bind('click', closeMenu);
              element.bind('click', function (event) {
        
                var elementWasOpen = (element === openElement);
        
                event.preventDefault();
                event.stopPropagation();
        
                if (!!openElement) {
                  closeMenu();
                }
        
                if (!elementWasOpen && !element.hasClass('disabled') && !element.prop('disabled')) {
                  element.parent().addClass('open');
                  openElement = element;
                  closeMenu = function (event) {
                    if (event) {
                      event.preventDefault();
                      event.stopPropagation();
                    }
                    $document.unbind('click', closeMenu);
                    element.parent().removeClass('open');
                    closeMenu = angular.noop;
                    openElement = null;
                  };
                  
                  function handler(e){
                    var elm = angular.element(e.target);
                    if(!elm.parents('.dropdown-menu').length){
                      e.stopPropagation();
                     ...