Knockout + customBinding không cập nhật

Question

Tôi có một câu hỏi nhanh về customBindings, hy vọng một số có thể giúp giải thích cho tôi? Tôi nghĩ rằng khi một quan sát được cập nhật thì bất kỳ tùy chỉnh nào ràng buộc mà có thể quan sát được sẽ có phương thức "cập nhật" được gọi. Tôi có thể thấy rằng khi tôi cập nhật quan sát của mình rằng những người đăng ký khác đang được thông báo, nhưng dường như tùy chỉnh này không được gọi.

Đây là ViewModel của tôi:

var innerModel = { 
    name: ko.observable('junk') 
}; 

var innerModel2 = { 
    name: ko.observable('junk2') 
}; 

var viewModel = { 
    im1: innerModel, 
    im2: innerModel2, 
    selectedModel: ko.observable({name:'xxx'}) 
}; 

và đây là CustomBinding tôi:

ko.bindingHandlers.custom = { 
    update: function(element, valueAccessor) { 
     console.log("BAM!"); 
     while (element.firstChild) 
      ko.removeNode(element.firstChild); 

     ko.renderTemplate('test', valueAccessor(), {}, element, 'replaceNode'); 

    } 
}; 

vị trí mẫu của tôi chỉ đơn giản là một khoảng có trưng bảng hiệu "tên" lĩnh vực:

<script id='test' type='text/html' charset='utf-8'> 
<span data-bind='text: name'></span> 
</script> 

Đây là HTML mà tôi sử dụng với customBinding:

<div id="container" data-bind="with: viewModel"> 
    <div data-bind="custom: selectedModel"> 
    </div> 
</div> 

Khi tôi cập nhật lựa chọnMô hình cho một trong hai mô hình bên trong, tên chính xác được hiển thị nhưng chức năng 'cập nhật' của customBinding không được gọi. Tôi có một thuê bao riêng biệt để các "selectedModel" quan sát được:

viewModel.selectedModel.subscribe(function(newValue) { 
    console.log(newValue.name()); 
}); 

và đó được gọi khi tôi thay đổi selectedModel, vậy tại sao không cập nhật của CustomBinding được gọi là?

Đây là một jsfiddle cho thấy vấn đề này: http://jsfiddle.net/gperng/twAcJ/

Bất kỳ trợ giúp sẽ được đánh giá cao!

Answer 1

Việc sử dụng with của bạn là sai trong trường hợp này. Nếu bạn sử dụng này, nó sẽ làm việc như bạn mong đợi:

<div id="container" data-bind="with: selectedModel"> 
    <div data-bind="custom: $data"> 
    </div> 
</div> 

Điều này là do trong ví dụ của bạn custom ràng buộc không phải là trên selectedModel, nhưng trên toàn bộ ViewModel chính nó mà không thay đổi.

Đây là jsfiddle của nó: http://jsfiddle.net/soniiic/twAcJ/7/

Answer 2

Bạn cần phải gọi hàm sau đây để làm cho nó hoạt động:

var valueUnwrapped = ko.utils.unwrapObservable(valueAccessor()) 

Hãy thử fiddle này để biết thêm: http://jsfiddle.net/twAcJ/13/