Knockout ràng buộc xử lý chức năng teardown?

Question

Tôi có trình xử lý ràng buộc loại trực tiếp sử dụng plupload để kéo và thả và tải lên ajax.

Để sử dụng tập lệnh plupload, tôi tạo một thể hiện của plupload mà lần lượt là trình lắng nghe sự kiện ràng buộc với các phần tử DOM.

Điều đó hoạt động tốt.

Tuy nhiên, tôi có danh sách "thư mục" và khi tôi nhấp vào một thư mục tôi hiển thị danh sách tệp trong thư mục đó. Tôi tái sử dụng các phần tử DOM tương tự cho điều này bằng cách liên kết selectedFolder(). Các tài liệu sử dụng foreach.

Vấn đề tôi có là trong trình xử lý ràng buộc của tôi, tôi làm tất cả các công cụ plupload trong hàm init và vì tôi sử dụng lại các phần tử DOM mà chúng có nhiều trình xử lý sự kiện. Điều này làm cho các sự kiện kéo và thả được gửi đến các trình xử lý alla. Điều này có nghĩa là nếu tôi thả một tệp trên danh sách tệp được hiển thị, sự kiện thả sẽ kích hoạt trên tất cả danh sách tệp được hiển thị trước đó.

Điều tôi đang tìm kiếm là một số chức năng dọn dẹp hoặc dọn dẹp trong trình xử lý liên kết, để tôi có thể hủy đăng ký tất cả các sự kiện bất cứ khi nào danh sách tệp bị hủy (có phải là từ không?).

Có lẽ chúng tôi không thể phát hiện được việc bỏ hàng? Làm thế nào sau đó tôi sẽ xử lý này? Tôi không muốn có một trường hợp toàn cầu, vì điều đó sẽ ngăn cản tôi sử dụng sự ràng buộc trên nhiều địa điểm cùng một lúc.

Xin lỗi vì không cung cấp cho bạn bất kỳ mã nào. Tôi đang trên điện thoại di động của tôi.

Chúc mừng!

Answer 1

Bạn có thể đăng ký trình xử lý sẽ được thực hiện bất cứ khi nào KO xóa các phần tử (như khi mẫu được hiển thị lại). Dường như:

//handle disposal (if KO removes by the template binding) 
    ko.utils.domNodeDisposal.addDisposeCallback(element, function() { 
     $(element).datepicker("destroy"); 
    }); 

Vì vậy, trong chức năng "init" của bạn, bạn sẽ đăng ký một callback dispose cho các phần tử đang được ràng buộc và bạn sẽ có một cơ hội để chạy bất cứ điều gì đang dọn dẹp mà bạn muốn.

Answer 2

Tôi tin rằng giải pháp được cung cấp ở đây sẽ chỉ hoạt động nếu Knockout là giải pháp loại bỏ nút DOM (nghĩa là khi nó rejigs mẫu). Tôi đã có một thời gian khó khăn để nó kích hoạt trong những điều kiện nhất định. Có thể có các tình huống mà bạn cần gọi lại để được thực hiện bất kể phần tử của bạn đã bị xóa; cho dù đó là với Knockout, hoặc thông qua jQuery.html(), vv (đặc biệt là trong một ứng dụng trang đơn).

Tôi đã tạo một phương pháp khác để thêm một móc như vậy với một chút trợ giúp từ jQuery. Sử dụng API sự kiện đặc biệt (được mô tả rõ ràng here), bạn có thể thêm phương thức được thực thi khi một sự kiện cụ thể là removed từ nút DOM (điều gì đó xảy ra khi teardown).

Nếu bạn đang sử dụng Knockout kết hợp với jQuery, bạn có thể quấn này thành một loại trực tiếp ràng buộc để tìm một cái gì đó như thế này:

ko.bindingHandlers.unload = { 
    init: function (element, valueAccessor) { 
     var eventName = 'your_unique_unLoad_event'; // Make sure this name does not collide 
     if (!$.event.special[eventName]) { 
      $.event.special[eventName] = { 
       remove: function (o) { 
        o.data.onUnload() 
       } 
      }; 
     } 
     $(element).on(eventName, { onUnload: valueAccessor()}, $.noop); 
    } 
}; 

Sau đó bạn có thể sử dụng trên bất kỳ yếu tố như thế này:

<div id="withViewModelMethod" data-bind="unload: aMethodOnMyViewModel" /> 
<div id="withInLineMethod" data-bind="unload: function() { /* ... */ }" /> 

Tôi nợ khoản tín dụng này SO post.