Làm thế nào tôi có thể cập nhật một quan sát được trong các ràng buộc tùy chỉnh?

Question

Tôi có một trình xử lý ràng buộc với logic đơn giản bên trong nơi tôi sẽ cập nhật các quan sát để nó sẽ cập nhật chính nó trong xem.

này trường hợp mẫu ia nơi mọi thứ hoạt động như mong đợi

Xem của tôi:

<input data-bind="value: name" /> 
<hr/> 
<div data-bind="fadeInText: name"></div> 

Code:

ko.bindingHandlers.fadeInText = { 
    update: function(element, valueAccessor) { 
     ko.bindingHandlers.text.update(element,valueAccessor);//text becoz its binded to div 
    } 
}; 

Ở đây tôi đang cố gắng để làm một cái gì đó như thế này (bên dưới) và tôi bị kẹt ở đây updating a observable

Quan điểm của tôi:

<input data-bind="value: name" /> 
<hr/> 
<input type="text" data-bind="fadeInText: name" /> 
<div data-bind="text:ko.toJSON($data)"></div> 

Code:

ko.bindingHandlers.fadeInText = { 
    update: function(element, valueAccessor) { 
      var value = valueAccessor(); 
    ko.bindingHandlers.value.update(element,valueAccessor); 
    $(element).change(function() { 
      value($(element).fadeInText('get')); 
     }); 
    } 
}; 

Trong kịch bản được đưa ra này có hai textbox khi tôi cập nhật một giá trị trong textbox-1 sau đó giá trị textbox-2 là nhận được đã cập nhật.

Nhưng khi tôi cố gắng cập nhật giá trị textbox-2 không có gì được cập nhật, tôi cảm thấy rất gần nhưng bây giờ tôi không thể giải quyết vấn đề này.

Checked chrome console tôi thấy Uncaught TypeError: undefined is not a function nhưng fadeInText hiện diện trong ràng buộc

Cập nhật:

tôi đã cố gắng allBindingsAccessor().fadeInText() tôi nhận được giá trị mỗi lần cũ không phải là mới bước một.

Fiddler cung cấp here

Có gì đó với cùng một cách làm nhưng làm việc của nó fiddler here.

Bất kỳ trợ giúp nào về điều này đều tuyệt vời.

Answer 1

Nếu bạn muốn quấn value ràng buộc, bạn phải gọi nó init cũng như:

ko.bindingHandlers.fadeInText = { 
    init: function(element, valueAccessor, allBindings) { 
     ko.bindingHandlers.value.init(element,valueAccessor, allBindings); 
    }, 
    update: function(element, valueAccessor) { 
     var value = valueAccessor(); 
     ko.bindingHandlers.value.update(element,valueAccessor); 
    } 
}; 

Working fiddle.

Đây là lý do: Trình xử lý cập nhật fadeInText của bạn được gọi tự động khi các thay đổi quan sát được - truy cập vào trình xử lý update đăng ký. Vì vậy, một nửa của liên kết hai chiều - có thể quan sát được trong lĩnh vực đầu vào - công trình.

Đối với nửa còn lại của hai chiều ràng buộc - lĩnh vực đầu vào để quan sát - bạn cần phải gọi init handler của value ràng buộc, bởi vì đó là nơi value bộ lên xử lý sự kiện cho nó để được thông báo khi đầu vào thay đổi trường.

Theo nguyên tắc chung, bạn sử dụng phần init của liên kết tùy chỉnh cho mã thay đổi có thể quan sát được khi phần tử HTML đã thay đổi (ví dụ: bằng cách gắn trình xử lý sự kiện) và phần update để thay đổi phần tử HTML khi quan sát đã thay đổi.