Javascript 掌握淘汰赛JS中的详细信息

我做错了什么？我试图创建一个简单的主细节视图，即“规范MVVM”示例

下面是一个在JSFIDLE中不起作用的简化示例：

我希望在文本框中看到所选“项”的名称，但它却说“可观察到”

以下是我的违规代码：

var list = [ { name: "item 1"} , { name: "Item 2" }];

var viewModel = {
    items : ko.observableArray(list),
    selectedItem : ko.observable(),
}

viewModel.setItem = function(item) {
    viewModel.selectedItem(item);   
}

ko.applyBindings(viewModel);

还有HTML

<ul data-bind="foreach: items">
    <li>
        <button data-bind="click: $root.setItem, text:name"></button>
    </li>
</ul>

<p>
    <input data-bind="value:selectedItem.name" />
</p>

你真的很接近了。只需执行

value:selectedItem（）。name

或更好地使用

和

绑定来更改范围。此外，您所引用的脚本稍微过时（在2.0中，单击将数据作为第一个参数传递）

此处示例：