Zugreifen auf das angeklickte Element in angularjs

Ich bin relativ neu in AngularJS und vermute, dass ich kein Konzept verstehe. Ich benutze auch Twitter Bootstrap und ich habe jQuery geladen.

Workflow: Der Benutzer klickt auf einen Link aus einer Liste, der Abschnitt “Master” wird aktualisiert und der Link-Nutzer klickt auf “Aktive class gewinnen”.

Einfaches HTML-Markup:

 

Tun Sie dies in jQuery:

 jQuery(".list-holder").on('click', 'a', function(event){ event.preventDefault(); jQuery(".list-holder li").removeClass('active'); jQuery(this).parent('li').addClass('active'); }); 

Aber ich kann nicht herausfinden, wie man Angular und jQuery integriert, um dies zu erreichen, weil ich Angular verwende, um die Masterliste (in JSON-Form) vom Server zu holen und eine Liste auf der Seite zu aktualisieren.

Wie integriere ich das? Ich finde das Element, auf das ich geklickt habe, nicht mehr, sobald ich in der angularreglerfunktion bin

Regler:

 function adminController($scope) { $scope.setMaster = function(obj) { // How do I get clicked element's parent li? console.log(obj); } } 

Solutions Collecting From Web of "Zugreifen auf das angeklickte Element in angularjs"

Während AngularJS Ihnen erlaubt, ein Klick-Ereignis (und damit ein Ziel davon) mit der folgenden Syntax zu erhalten (beachten Sie das $event Argument zur setMaster function; Dokumentation hier: http://docs.angularjs.org/api/ ng.directive: ngClick ):

 function AdminController($scope) { $scope.setMaster = function(obj, $event){ console.log($event.target); } } 

Das ist keine sehr eckige Art, dieses Problem zu lösen. Bei AngularJS steht die Modellmanipulation im Vordergrund. Man würde ein Modell mutieren und AngularJS das Rendering berechnen lassen.

Die AngularJS-Methode zur Lösung dieses Problems (ohne Verwendung von jQuery und ohne das Argument $event ) wäre:

 

{{selected | json}}

wo Methoden im Controller so aussehen würden:

 $scope.setMaster = function(section) { $scope.selected = section; } $scope.isSelected = function(section) { return $scope.selected === section; } 

Hier ist die komplette jsFiddle: http://jsfiddle.net/pkozlowski_opensource/WXJ3p/15/