Knockout.js 我是否应该在viewModel上的另一个可观察对象中包装具有可观察属性的类实例？

我有一个具有可观察属性的可构造对象

function Item() { this.prop = ko.observable() }

我的视图模型创建项目的实例

var instance = ko.observable(new Item())

我是否应该将实例包装在ViewModel上的可观察对象中？如果我没有将“item”包装在可观察对象中，那么该组件就根本不工作

var instance = new Item()

我将该实例作为参数传递到组件中

<component params="item: item"></component>  

我不知道如何从组件模板绑定到实例的可观察属性。当badge.disabled observable更改时，disabled类别未更改

template: '<img class="ui image" src="http://fakeimg.pl/300/" data-bind="css: { disabled: item().disabled }" >'

模板：“”

这是完整的例子

---

非常感谢您的帮助。谢谢。

您只需修改部分型号代码

 ko.components.register('badge-button', {
            viewModel: function(params) {
                var self = this;

                 self.badge = params.badge();
                 self.open = function() {

                    self.badge.toggleHas();
                    self.badge.toggleActive();
                }
            },

            template: 
                '<img class="ui image" src="http://fakeimg.pl/300/" data-bind="click: open, css: { disabled: badge.disabled }" >'
        });

ko.components.register（'badge-button'）{
viewModel:函数（参数）{
var self=这个；
self.badge=params.badge（）；
self.open=函数（）{
self.badge.toggleHas（）；
self.badge.toggleActive（）；
}
},
模板：
''
});

---

工作示例：

这确实有效，但在ajax回调中创建标记时无效。knockout-min.js:16未捕获类型错误：无法处理绑定“css:function（）{return{disabled:badge.disabled}}”消息：无法读取未定义的属性'disabled'，确保在Ajax成功中获得数据。或者，如果在创建新实例的地方根本没有返回到成功回调，那么组件的

将是未定义的
，记录实例表明它在回调中正确创建。很可能kockout在Ajax success中创建新实例之前加载组件。如果是这样，如何创建依赖远程数据的组件？