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 JS调试器调用getData函数来修改firebug列值后检查td列值时，会在可观察数组中修改该值，但不会反映更改在相应的pop()的UI中。在这里，我必须修改一列而不是整行的一个值，因此我无法使用push()和{{1}}方法。

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

Answer 1

ObservableArray()仅观察数组中的项目。它不会观察数组中每个项目的每个属性是否有变化。

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

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

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

1 个答案: