knockout.js - 当可观察数组中的项目发生更改时，淘汰赛不更新 dom

Question

我目前正在玩淘汰赛，并且遇到了可观察数组的问题。

当我更改数组中的任何值时，它似乎没有更新 dom。奇怪的是，如果我添加一个新元素，它会反映在屏幕上，但是如果我在它仍然显示原始值之后更改值

<div data-bind="text: ObvArray().length"></div>

<table>
    <tbody data-bind="foreach: ObvArray">
        <tr>
            <td><input data-bind="value: name"/></td>
        </tr>
    </tbody>
</table>

<button data-bind="click: addEl">Add Element</button>

<div data-bind="foreach: ObvArray">
    <div data-bind="text: name"></div>
</div>

function MyFirstVM(){
    this.ObvArray = ko.observableArray([
        {name: "Test 1"},
        {name: "Test 2"},
        {name: "Test 3"}
    ]);

    this.PrintTestProp = function(){
        return this.TestProp();
    }

    this.addEl = function(){
        this.ObvArray.push({name: "Another Test"})
    }
}

ko.applyBindings(new MyFirstVM());

这是我的小提琴。只需单击 buttonm 即可添加一个新元素。这很好用，但是如果我更改文本字段中的值，它不会反映在按钮下方的 dom 中

http://jsfiddle.net/EUC27/

Answer 1

您还需要使数组的项目可观察

    this.ObvArray = ko.observableArray([
        {name: ko.observable("Test 1")},
        {name: ko.observable("Test 2")},
        {name: ko.observable("Test 3")}
    ]);