2011-11-30 35 views
6

Tôi có một tình huống kỳ quặc. Về cơ bản, tôi có hai liên kết tùy chỉnh được sử dụng để tạo hoạt ảnh cho phần tử DOM thành giá trị mới. Đây là aWidth và aRight, tương ứng với các giá trị độ rộng và đúng tương ứng.Tại sao ràng buộc tùy chỉnh KnockoutJS của tôi được kích hoạt?

tôi đã thực hiện các cam kết ràng buộc như thế này:

<div class='classname' data-bind="aRight: right, aWidth: containerWidth, style: { zIndex: zindex, left: (left() + 'px'), height: (containerHeight() + 'px') }"> 

... và các ràng buộc tùy chỉnh giống như thế này:

  ko.bindingHandlers.aWidth = 
      { 
       update: function (element, valueAccessor, allBindingsAccessor, context) 
       { 
        // Get the value accessor 
        var value = valueAccessor(); 

        // Get the new width and the duration of the animation 
        var newWidth = ko.utils.unwrapObservable(value); 
        var duration = 500; 

        $(element).animate({ width: newWidth }, duration, "swing"); 
       } 
      }; 

      ko.bindingHandlers.aRight = 
      { 
       update: function (element, valueAccessor, allBindingsAccessor, context) 
       { 
        // Get the value accessor 
        var value = valueAccessor(); 

        // Get the new width and the duration of the animation 
        var newRight = ko.utils.unwrapObservable(value); 
        var duration = 500; 

        $(element).animate({ right: newRight }, duration, "swing"); 

        console.log("aRight Called: newRight - " + newRight + ", duration - " + duration); 
       } 
      }; 

Vì vậy, vấn đề xuất phát xung quanh khi chúng ta thay đổi một quan sát khác hơn hai quan sát ràng buộc tùy chỉnh của tôi, ví dụ zindex.

Nếu chúng ta thay đổi ZIndex thể quan sát được, giá trị được cập nhật một cách chính xác trong DOM, nhưng đối với một số lý do, xét đúng tôi cũng ràng buộc được kích hoạt! ...

tôi không có bất kỳ tham chiếu đến nó trong tôi aRight tùy chỉnh ràng buộc do đó chắc chắn không thể là một phụ thuộc?

Ràng buộc aRight của tôi cũng được kích hoạt khi liên kết aWidth của tôi được kích hoạt quá, cũng hơi lạ!

Có ai có bất kỳ ý tưởng nào về điều này không?

Cảm ơn rất nhiều!

Andy.

Cập nhật

Đây là một phần của mô hình xem mà cập nhật các chỉ số, mà khi làm xét đúng ràng buộc để lửa tùy chỉnh của tôi (điều này là rất nhiều psudo mã bằng cách này!):

var page = function() 
    { 
     this.zindex = ko.observable(0); 
     this.right = ko.observable(0); 
     // and other observables.... 
    } 

    var viewModel = function() 
    { 
     var pages = ko.oberservableArray(); 
     // populate the pages array etc... 

     this.someMethod = function() 
     { 
      // Do some stuff... 
      this.anotherMethod(); 
      // Do some other stuff 
     } 
     .bind(this); 

     this.anotherMethod() = function 
     { 
      var pageCount = this.pages().length; 
      for (var pageNum = 0; pageNum < pageCount; pageNum++) 
      { 
       var page = this.pages()[pageNum]; 
       page.zindex(/* a different value */); // This is what causes my aRight binding to fire... 
      } 
     } 
     .bind(this); 
    } 

cập nhật

tôi chỉ đọc một bài đăng ở đây: http://groups.google.com/group/knockoutjs/browse_thread/thread/26a3157ae68c7aa5/44c96d1b748f63bb?lnk=gst&q=custom+binding+firing#44c96d1b748f63bb

nói:

Bên cạnh đó, một ràng buộc sẽ có chức năng cập nhật của nó chạy một lần nữa, nếu khác ràng buộc trong các thuộc tính cùng một dữ liệu ràng buộc được kích hoạt là tốt.

Điều này có nghĩa là những gì tôi thấy là ràng buộc tùy chỉnh của tôi đang được kích hoạt khi bất kỳ ràng buộc nào khác trong thuộc tính ràng buộc dữ liệu được kích hoạt (nó chỉ xảy ra có thể là zindex là lần đầu tiên tôi thấy thay đổi) ? Đây có phải là không một chút lẻ/sai? ...

Cập nhật

Tôi đã có một fiddle đơn giản mà tôi nghĩ khá nhiều tổng kết vấn đề của tôi. Nó có vẻ như bất kỳ ràng buộc trên cùng một thuộc tính ràng buộc dữ liệu như nhiều ràng buộc tùy chỉnh sẽ làm cho nó cập nhật!

http://jsfiddle.net/J6EPx/2/

Hmmm ... đoán tôi sẽ phải làm việc xung quanh nó bằng cách thủ công kiểm tra trong tùy chỉnh của tôi ràng buộc về việc liệu giá trị đã thực sự thay đổi hay không !!Điều này không đánh bại điểm thực sự của một ràng buộc?

Tôi cũng đã đăng một câu hỏi chính xác hơn trên các diễn đàn Knockout: http://groups.google.com/group/knockoutjs/browse_thread/thread/d2290d96e33f1d5a

+0

Tôi tự hỏi nếu nó là cái gì để làm với $ (element) .animate()? Điều gì xảy ra nếu thay vì làm động, bạn chỉ cần thay đổi chiều rộng/chiều cao một cách trực tiếp? –

+0

Câu hỏi hay ... hãy cho tôi một giây ... :) – Andy

+0

@ Alex Key, nah, sử dụng $ (phần tử) .css ("right", newRight + "px"); không giúp đỡ ít nhất. Vẫn đang được kích hoạt khi chỉ mục được cập nhật! Nhờ đề nghị mặc dù! – Andy

Trả lời

8

này hiện là do thiết kế. Tất cả các ràng buộc trong một ràng buộc dữ liệu được kích hoạt khi bất kỳ ràng buộc nào bị cháy. Điều này là bởi vì tất cả chúng được bao bọc trong một đơn vị phụ thuộc duy nhất. Trong một số trường hợp, các ràng buộc có sự phụ thuộc giữa nhau (nếu các tùy chọn được cập nhật, thì giá trị cần phải chạy để đảm bảo rằng nó vẫn là giá trị hợp lệ). Tuy nhiên, trong một số trường hợp, điều này gây ra một vấn đề.

Có một mẫu khác mà bạn có thể sử dụng khi tạo liên kết tùy chỉnh giúp giảm thiểu hành vi này. Thay vì xác định các đường ruột của chức năng của bạn trong chức năng "cập nhật", bạn sẽ thực sự tạo ra dependObservable của riêng bạn trong hàm "init". Nó sẽ giống như sau:

ko.bindingHandlers.custBinding= { 
    init: function(element, valueAccessor) { 
     ko.dependentObservable({ 
      read: function() { 
       ko.utils.unwrapObservable(valueAccessor()); 
       alert("custBinding triggered"); 
      }, 
      disposeWhenNodeIsRemoved: element 
     }); 
    } 
}; 

http://jsfiddle.net/rniemeyer/uKUfy/

+1

Mất một chút thời gian để có được đầu của tôi xung quanh đó, nhưng đề nghị của bạn có vẻ hợp lý! Tôi phải thừa nhận mặc dù, tôi là một chút ngạc nhiên rằng mặc định là để bọc tất cả trong một phụ thuộc duy nhấtObservable. Tôi không nghĩ rằng WPF/Silverlight làm việc theo cách này ... không phải để nói nó sai ... chỉ khó hiểu! :) – Andy

+0

Hành vi mặc định không phải là lý tưởng trong nhiều trường hợp và có thể/nên được cải thiện. Chúng ta sẽ phải cân bằng với việc phá vỡ hành vi hiện tại (một số người hiện đang sử dụng các ràng buộc tùy chỉnh mà không truy cập các quan sát và dựa vào các ràng buộc khác đang được kích hoạt). –

+0

Rất đúng! 'Tis một tình huống khó khăn! – Andy

Các vấn đề liên quan