Question

我有一个Knockout视图模型，它维护三件事：默认属性列表，实体列表和实体类列表。每个实体类都有一个可用实体的子集和一个覆盖默认属性的单独属性列表。

我要做的是突出显示实体类具有覆盖相应默认值而不更改它的属性的情况 - 所谓的“坏覆盖”。我是Knockout的新手，我无法想办法做到这一点。问题在于它需要是一个计算属性（因为表经常更新，并且数据是从服务器检索的），这是基于比较视图模型中深层的值和更浅层的值。映射看起来像这样：

function Master() //(view model)
{
    var self = this;
    self.EntityClasses = ko.observableArray();
    self.DefaultProperties = ko.observableArray();
    self.Entites = ko.observableArray();
}

function EntityClass()
{
    var self = this;
    self.Properties = ko.observableArray();
}

我希望将给定实体中的属性与默认属性列表中的属性进行比较，以确定是否存在不同的覆盖属性。比较将在以下位置：

<div data-bind="foreach: EntityClasses">
  <span data-bind="if: PropertiesVisible">
    <h3><span data-bind="text: EntityClassName"></span> Properties</h3>
    <table>
    <tr><th>Property ID</th><th>Key</th><th>Value</th><th>Flags</th></tr>
    <tbody data-bind="foreach: Properties"> <!-- in that entity class -->
      <tr>
        <td data-bind="text: PropertyID"></td>
        <td data-bind="text: Key"></td>
        <td data-bind="text: Value"></td>
        <td>
          <span data-bind="if: <SOME BOOLEAN>"> <!-- if equal to default -->
            <!-- Indicate bad overwrite -->
          </span>
        </td>
        </tr>
      </tbody>
    </table>
  </span>
</div>

Answer 1

Knockout包含所谓的computed obervables，它完全符合您的需要。您可以使用ko.computed()创建它们如果在传递给计算的observable的函数中访问其他observable，则计算机将在依赖项更新时自动更新。

function Master() //(view model)
{
    var self = this;
    self.EntityClasses = ko.observableArray();
    self.DefaultProperties = ko.observableArray();
    self.Entites = ko.observableArray();
    self.overwritingProperties = ko.computed(function(){
        //compare properties
        self.Entities.doSomething //<- when this observable updates (e.g. an entry is added), the computed observable is reevaluated automatically
        var result = true;
        return result;
    });
}

您可以像任何其他可观察对象一样绑定它们：

<span data-bind="if: overwritingProperties">

Knockout.js：根据比较的属性确定可见性

1 个答案: