knockout -当改变可观察数组中列的单个值时，UI不更新

Question

我认为以下tbody:

    <tbody data-bind="foreach: ListingData">
        <tr>
            <!-- ko foreach: $parent.ColumnNames -->
              <!-- ko if: $data.FieldName == 'Industry' -->
<td data-bind="event:{ dblclick: function(data, event){ $root.getData(data, event , $parentContext.$index())}}">
    <span data-bind="text: $parent[$data.DisplayName]"></span>
              </td>
              <!-- /ko -->
            <!-- /ko -->
        </tr>
    </tbody>

ListingData是一个可观察数组，包含行和列形式的数据。下面是我的getData函数:

getData: function (data, event, index) {
    (viewModel.ListinData()[index])["Industry"]='new value';
}

当用户双击Industry td元素时，我必须修改可观察数组中Industry列的值，如上面的getData方法所示，基于我能够使用$parentContext.index()获得的项目索引。现在，当我检查Industry列值通过使用firebug JS调试器调用getData函数修改后，该值在可观察数组中得到修改，但变化没有反映在相应的td的UI中。这里我必须修改一列的一个值，而不是整行，所以我不能使用pop()和push()方法。

如何使可观察数组更新UI时，在其列中的单个值被修改?

Answer 1

ObservableArray()只观察数组中的项。它不会观察数组中每个元素的每个属性的变化。

因此，您需要将Industry in更改为observable()，然后使用函数语法设置它。

getData: function (data, event, index) {
    (viewModel.ListingData()[index])["Industry"]('new value');
    // or simply //
    viewModel.ListingData()[index].Industry('new value');
}