Swipe hành động ràng buộc trong knockoutjs

Question

Tôi đang sử dụng loại trực tiếp như khung chính trong ứng dụng của tôi và nó phải hỗ trợ máy tính bảng và thiết bị di động. Khi khung công tác được xây dựng trên trình xử lý ràng buộc, tôi tự hỏi làm cách nào để có thể tùy chỉnh liên kết đến các hành động (như vuốt và các thiết bị cụ thể khác) hoặc có thể thực hiện điều gì đó như thế này?

Answer 1

Có lẽ quá muộn, nhưng đây là một thư viện có thêm cảm ứng gắn vào knockoutjs: https://github.com/yaroslavya/knockouch

Answer 2

Không có gắn kết trong các khung công tác cụ thể vì knockout.js không phụ thuộc vào bất kỳ khung công tác nào khác. Nó sẽ là một nhiệm vụ tầm thường để chuyển đổi mã chọn jQuery của bạn thành các trình xử lý ràng buộc tham chiếu đến liên kết @niko cung cấp ở trên.

Answer 3

Tôi không biết nếu nó vẫn giúp, nhưng đây là một con trỏ.

1. Sử dụng thư viện như Hammer.js để thực hiện các tác vụ cảm ứng đa điểm.
2. Viết trình xử lý ràng buộc tùy chỉnh và gọi ràng buộc sự kiện mặc định của loại trực tiếp. một cái gì đó như thế này cho một swipe. (Tác giả của fiddle sử dụng tap.js)

http://jsfiddle.net/snaptopixel/spByj/

bây giờ tất cả bạn làm trong html của bạn là

<button data-bind="tap:doSomething">Click Me</button>​ 

nơi doSomething là một hàm.

Answer 4

1. Tạo một bindingHandler. Ở đây bạn đi một ví dụ về một dự án thực tế

   ko.bindingHandlers.swipeSections = { 
   init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) { 
       var elem = $(element); 
       var params = valueAccessor().split('##'); 
   
       elem.unbind('swipe'); 
   
       elem.swipe({ 
        swipeLeft: function (event, direction, distance, duration, fingerCount) { 
         //process 
        }, 
        swipeRight: function (event, direction, distance, duration, fingerCount) { 
         //process 
        } 
       }); 
   } 
   

   };

2. Sử dụng một thư viện swipe: https://github.com/mattbryson/TouchSwipe-Jquery-Plugin

   script type="text/javascript" src="scripts/jquery.touchSwipe.js" 
   

3. Xác định mục của ràng buộc

   div id="myid" class="section" data-bind="swipeSections: 'leftPanel##rightPanel'"