Wie kann ich eine AngularJS-Direktive erstellen, um StopPropagation zu stoppen?

Ich versuche, "stopPropagation" zu stoppen, um zu verhindern, dass ein Dropdown-Menü der Twitter-Bootstrap-Navigationsleiste geschlossen wird, wenn auf ein Element (Link) in einem Li geklickt wird. Die Verwendung dieser Methode scheint die übliche Lösung zu sein .

Scheint in Angular eine Richtlinie der Ort zu sein, um dies zu tun? Also habe ich:

// do not close dropdown on click
directives.directive('stopPropagation', function () {
    return {
        link:function (elm) {            
            $(elm).click(function (event) {                
                event.stopPropagation();
            });
        }
    };
});

... aber die Methode gehört nicht zum Element:

TypeError: Object [object Object] has no method 'stopPropagation'

Ich binde die Richtlinie mit

<li ng-repeat="foo in bar">
  <div>
    {{foo.text}}<a stop-propagation ng-click="doThing($index)">clickme</a>
  </div>
</li>

Irgendwelche Vorschläge?

Ich habe diesen Weg benutzt: Erstellt eine Direktive:

    .directive('stopEvent', function () {
        return {
            restrict: 'A',
            link: function (scope, element, attr) {
                if(attr && attr.stopEvent)
                    element.bind(attr.stopEvent, function (e) {
                        e.stopPropagation();
                    });
            }
        };
     });

das könnte so verwendet werden:

<a ng-click='expression' stop-event='click'>

Dies ist eine allgemeinere Methode, um die Weitergabe von Ereignissen jeglicher Art zu stoppen.

"Derzeit stoppen einige Anweisungen (z. B. ng: click) die Ereignisausbreitung. Dies verhindert die Interoperabilität mit anderen Frameworks, die auf der Erfassung solcher Ereignisse beruhen." - Link

... und konnte ohne Anweisung beheben und einfach Folgendes tun:

<a ng-click="doThing($index); $event.stopPropagation();">x</a>

stopPropagationmuss für ein Ereignisobjekt aufgerufen werden, nicht für das Element selbst. Hier ist ein Beispiel:

compile: function (elm) {
    return function (scope, elm, attrs) {
        $(elm).click(function (event) {
            event.stopPropagation();
        });
    };
}

Hier ist eine einfache, abstrakte Anweisung, um die Weitergabe von Ereignissen zu stoppen. Ich denke, es könnte für jemanden nützlich sein. Übergeben Sie einfach den Fall, dass Sie aufhören möchten.

<div stopProp="click"></div>

app.directive('stopProp', function () {
  return function (scope, elm, attrs) {
    elm.on(attrs.stopProp, function (event) {
        event.stopPropagation();
    });
  };
});