Question

我有一个可观察的数组AllItems定义为

var ViewModel = function () { 
  var self = this; 
  self.AllItems = ko.observableArray([]);
}

它被来自ajax调用的数据填充，我只是将从Ajax调用接收的属性直接添加到数组而不定义它们。

我在下面的HTML中使用它来填充表格。

var ViewModel = function() {
    var self = this;
    self.AllItems = ko.observableArray([]);
}
$(document).ready(function() {
    ko.applyBindings(new ViewModel());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.1/knockout-min.js"></script>
<table>
  <tbody data-bind="foreach: AllItems">
    <td>
      <span>$</span><span data-bind="text: $data.RequestedPrice"></span>
    </td>

    <!-- ko ifnot: (Number(RequestedPrice) > Number(ItemDetails.SmPrice))  -->
    <input type="button" disabled value="Approve" id="Approved" data-bind="click: $root.ApproveItem" style="background-color:#e1eae5 !important" />
    <!-- /ko -->
    <!-- ko ifnot: (Number(RequestedPrice) > Number(ItemDetails.SmPrice))  -->
    <input type="button" disabled value="Approve" id="Approved" data-bind="click: $root.ApproveItem" style="background-color:#e1eae5 !important" />
    <!-- /ko -->

    <nobr>$
      <input type="text" class="priceChange" onkeypress="return isNumberKey(event)" style="display:inline !important" data-bind="value: $data.RequestedPrice" />
    </nobr>
  </tbody>
</table>

所以我在上面的HTML中有三件事。首先，我只是显示所要求价格的文本。第二，我用它来禁用一个按钮，第三个我正在使它成为一个可编辑的字段。

问题在于，当我更改值时，它不会反映在文本中，而且第二种用于禁用按钮的情况也不会更新。有人可以告诉我我需要做些什么。

Answer 1

三个选项：

将来自后端的js（on）的自定义映射写入具有可观察属性的对象;
使用ko.mapping;
使用knockout.es5和一些自定义代码;

Knockout，与Angular 1相反，默认情况下要求您明确表示您想要观察哪些内容（使用ko.mapping时，您明确表示所有内容都是可观察的）。

使KnockOut可观察数组属性可观察

1 个答案: