Cách lấy phần tử DOM đã kích hoạt ng-thay đổi?

Question

Tôi đang sử dụng angularJS. Tôi có một vài <select> yếu tố trên trang của mình, đều có riêng của mình ng-change, ví dụ:

<select id="hairColorComponent" ng-model="hairColor" 
     ng-options="option.name for option in hairColorData" 
     ng-change="updateUserData()"> 

Tôi muốn để có thể xác định DOM yếu tố đã được cập nhật từ bên trong updateUserData chức năng, mà không cần phải tự xác định nó làm tham số cho mỗi thuộc tính ng-change.

Có một số event hoặc caller hoặc thứ gì đó tương tự mà tôi có thể sử dụng trong ngữ cảnh updateUserData?

Hy vọng rằng một cái gì đó giống như ng-change="updateUserData(caller)"

Answer 1

Không có (dễ dàng) cách để làm điều này bằng cách thiết kế. Bộ điều khiển góc được cho là hoàn toàn tách biệt với DOM, vì vậy nếu bạn thấy mình cần tham khảo DOM trong chúng, bạn có thể đang tiếp cận mọi thứ theo cách sai.

Nếu HTML của bạn là

<select id="hairColorComponent" ng-model="hairColor" 
     ng-options="option.name for option in hairColorData" 
     ng-change="updateUserData()"> 

Sau đó thay đổi các lựa chọn sẽ thay đổi giá trị của $scope.hairColor trong điều khiển của bạn. Trong updateUserData() chỉ cần đọc giá trị của nó và hành động phù hợp.

Nếu trong trường hợp của bạn thực sự không có cách nào để làm điều đó ngoại trừ việc tham chiếu DOM, bạn có thể làm điều đó bằng cách viết một chỉ thị tùy chỉnh. Nói chung, thao tác DOM trực tiếp trong Angular nên là một loại biện pháp cuối cùng mặc dù.

Answer 2

Tìm thấy điều này trên google, cuối cùng tôi đã giải quyết được sự cố của mình, vì vậy đây là giải pháp của tôi.

Nếu bạn chỉ cần ID, bạn luôn có thể truyền nó như một tham số.

<select id="hairColorComponent" ng-model="hairColor" 
     ng-options="option.name for option in hairColorData" 
     ng-change="updateUserData('hairColorComponent')"> 

Vẫn không siêu sạch, nhưng nó đã giải quyết được sự cố của tôi. Vì tôi thực sự cần phần tử dom, tôi đã sử dụng jQuery để lấy phần tử.

$scope.updateUserData = function (id) { 
    var element = jQuery('#'+id); 
}; 

(Đối với những người tự hỏi, tôi đang làm hết sức mình với chuyển đổi mã di sản mà "kỳ diệu" giúp tiết kiệm thiết lập người dùng trên các trang trên tất cả các trang web.)