javascript - Knockout.js，依赖于 Observable 的条件 Observable？

Question

这里对 KOjs 和 STOF 有点菜鸟，有个问题，

我有一个可观察量，它们的数据是数字 0、1、2 或 3。我希望其他可观察量保存由该数据有条件设置的数据。

示例

this.isText = ko.observable(data.isText);
this.formatted.isText = ko.computed(function() {
    var it = self.isText();
    if (it == '0') {
      return 'No';
    }
    else if (it == '1') {
      return 'Yes'
    }
    else {
      return 'Not Specified'
    }
  });

我的示例代码片段未按预期运行。

实现保存可观察 isText 的格式化文本版本的正确方法是什么？

<小时/>

对象是如何创建的，

function ListItem(data) {
    this.isText = ko.observable(data.isText);
    this.formatted.isText = ko.computed(function() {
        var it = self.isText();
        if (it == '0') {
            return 'No';
        }
        else if (it == '1') {
            return 'Yes'
        }
        else {
            return 'Not Specified'
        }
    });
}

this.loadList = function(data) {
    // console.log(data);
    $.getJSON('someLoader.php', {
      checklistID: data.id,
      checklistRev: data.rev
    }, function(json, textStatus) {
      if (textStatus == 'success') {
        for (var i = 0; i < json.length; i++) {
          model.formData.push(new ListItem(json[i]));
        }
      }
      else {
        console.log('Error Competing Request');
      }
    });
  }

HTML，

<td colspan="1">
    <select class="form-control" data-bind="visible: status().edit, value: isText()">
        <option value="1">Yes</option>
        <option value="0">No</option>
    </select>
    <span data-bind="text: formated.isText(), visible: !status().edit()"></span>
</td>

一切作为一个整体工作，可观察量得到正确声明，没有错误，第一次加载时一切看起来都正常。如果 isText() 可观察值更新，但 formatted.isText() 不会更新以反射(reflect)更改。如果我在终端中进行控制台登录，则 isText() 的值是否正确取决于它是否已更新。因此，在初始加载时，如果它为 1 并且更新为 0，它将保留值 0。

Answer 1

我认为您想要做的是将计算值附加到其父可观察值。我见过 RNiemeyer 经常使用这种技术来保持代码更简洁，尤其是在序列化 View 模型时。如果是这样，那么我认为你想要做的是交换 formatted.isText 中“isText”和“formatted”的顺序.

正如 Thibaut Remy 的回答已经暗示的那样，你不能将计算附加到任何东西上，并且由于“格式化”已经不是你基本上说的东西 undefined.isText = ko.computed(...)相反，您应该将计算值附加到现有的可观察值: this.isText.formatted = ko.computed(...) ，并在您的绑定(bind)中类似地调用它: <span data-bind="text: isText.formatted(), visible: !status().edit()"></span> .

这是一个jsfiddle