Tôi có một chỉ thị Góc đặt chiều cao của phần tử bằng với chiều cao bên trong của cửa sổ trình duyệt (+/- một độ lệch đã cho). Chỉ thị này phản hồi sự kiện "thay đổi kích thước" của cửa sổ và điều chỉnh chiều cao của cửa sổ tương ứng. Khi phạm vi của chỉ thị của tôi phát ra sự kiện '$ destory', tôi loại bỏ ràng buộc với sự kiện "thay đổi kích cỡ" (tôi nghĩ việc rời khỏi nó sẽ gây ra một số vấn đề, sửa tôi nếu tôi sai).Làm thế nào để dọn dẹp an toàn ràng buộc sự kiện AngularJS theo chỉ thị
Tôi không biết cách tách rời sự kiện này theo cách "an toàn". Điều gì xảy ra nếu tôi có nhiều phiên bản của chỉ thị này trong toàn bộ ứng dụng của mình và điều gì sẽ xảy ra nếu tôi có các chỉ thị khác đính kèm sự kiện 'thay đổi kích thước'?
JQuery có khái niệm về không gian tên sự kiện có vẻ như là một giải pháp tốt, nhưng thực hiện của Angular (JQLite) does not support this. Tôi không muốn sử dụng JQuery vì tôi đã sử dụng Angular, vì vậy tôi phải làm gì?
Dưới đây là các mã cho chỉ thị của tôi như ngày nay
window.angular.module('arcFillClient', [])
.directive('arcFillClientY', ['$window',
function ($window) {
function link($scope, el, attrs) {
var setHeight,
onResize,
cleanUp;
setHeight = function (offSetY) {
var newHeight;
offSetY = offSetY || 0;
newHeight = Math.max($window.innerHeight + parseInt(offSetY, 10)) + 'px';
el.height(newHeight);
};
onResize = function() {
var offset;
offset = attrs.arcFillClientY || 0;
setHeight(offset);
};
attrs.$observe('arcFillClientY', setHeight);
window.angular.element($window).on('resize', onResize);
cleanUp = function() {
window.angular.element($window).off('resize');
};
$scope.$on('$destroy', cleanUp);
}
return {
link: link
};
CẬP NHẬT Trông giống như một trường hợp RTFM, nhưng chỉ trong trường hợp bất cứ ai khác đi lang thang ở đây, ở đây là một số thông tin hơn. Chuyển hàm gốc (trong trường hợp của tôi OnResize) đến .off() hoạt động để cô lập phạm vi của hàm .off(). Từ docs:
Trình xử lý cũng có thể được xóa bằng cách chỉ định tên hàm trong đối số xử lý. Khi jQuery {ahem ... JQLite} gắn một trình xử lý sự kiện, nó gán một id duy nhất cho hàm xử lý.
Dưới đây là các cập nhật cleanUp chức năng từ chỉ thị của tôi:
cleanUp = function() {
window.angular.element($window).off('resize', onResize);
};
Cảm ơn tasseKATT, Karolis và Hans vì những đóng góp của bạn.
Thông tin thêm về chủ đề cho những người quan tâm: http: // stackoverflow.com/a/27016855/2887841 – tasseKATT
Tôi có một ý tưởng về điều này. Khi bạn áp dụng chỉ thị trên 10 phần tử, điều đó có nghĩa là cửa sổ có 10 thay đổi kích thước danh sách sự kiện với hàm onResize không? Hoặc là hàm onResize được ghi đè mỗi khi nó được đặt .... – poashoas