Truy cập phần tử được nhấp trong angularjs

Tôi còn khá mới với AngularJS và nghi ngờ tôi không nắm bắt được một khái niệm nào. Tôi cũng đang sử dụng Twitter Bootstrap và tôi đã tải jQuery.

Quy trình làm việc: Người dùng nhấp vào một liên kết từ danh sách, phần "chính" được cập nhật và người dùng liên kết đã nhấp vào lớp hoạt động.

Đánh dấu HTML cơ bản:

<ul class="list-holder" ng-controller="adminController">
   <li><a ng-click="setMaster('client')">Clients</li>
   <li><a ng-click="setMaster('employees')">Employees</li>
   <li><a ng-click="setMaster('etc')>Etc...</li>
</ul>

Làm điều này trong jQuery:

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

Nhưng tôi không thể tìm ra cách tích hợp Angular và jQuery để hoàn thành công việc này, bởi vì tôi đang sử dụng Angular để lấy danh sách chính (ở dạng JSON) từ máy chủ và cập nhật danh sách trên trang.

Làm thế nào để tôi tích hợp này? Tôi dường như không thể tìm thấy phần tử mà tôi đã nhấp vào khi tôi ở trong chức năng điều khiển góc

Điều khiển:

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

Trong khi AngularJS cho phép bạn bắt tay vào một sự kiện nhấp chuột (và do đó là mục tiêu của nó) với cú pháp sau (lưu ý $eventđối số cho setMasterhàm; tài liệu ở đây: http://docs.angularjs.org/api/ng.directive : ngClick ):

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

Đây không phải là cách rất góc cạnh để giải quyết vấn đề này. Với AngularJS, trọng tâm là thao tác mô hình. Người ta sẽ biến đổi một mô hình và để AngularJS tìm ra kết xuất.

Cách AngularJS giải quyết vấn đề này (không sử dụng jQuery và không cần thông qua $eventđối số ) sẽ là:

<div ng-controller="AdminController">
    <ul class="list-holder">
        <li ng-repeat="section in sections" ng-class="{active : isSelected(section)}">
            <a ng-click="setMaster(section)">{{section.name}}</a>
        </li>
    </ul>
    <hr>
    {{selected | json}}
</div>

nơi các phương thức trong bộ điều khiển sẽ trông như thế này:

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

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

Dưới đây là jsFiddle hoàn chỉnh: http://jsfiddle.net/pkozlowski_opensource/WXJ3p/15/