knockoutjs - Computed Observable 返回错误答案

【问题标题】：knockoutjs - Computed Observable returns errorknockoutjs - Computed Observable 返回错误
【发布时间】：2012-07-15 07:57:06
【问题描述】：

我正在从 Web 服务重新调整 JSON 对象，并使用 knockout 2.01 来显示结果。我能够毫无问题地显示我的结果，但是一旦我尝试将计算的 observable 添加到视图模型中，我就会收到以下错误。

我在下面的这段代码中缺少什么？

Uncaught TypeError: Object # has no method 'dateCreated'

!--- JSON

{"jobTitle":"Digital designer","dateCreated":"7/7/2012","timeCreated":"2:27    PM","location":"Perth","jobSummary":"one\ntwo\nthree","Uri":"/candidates/view-all-jobs/digital-designer/","CreateDate":"\/Date(1341635236000)\/"}

!-- html

<div data-bind="foreach: $data">
 <article>
    <header>
      <time datetime="2007-08-29T13:58Z"></time>
      <h3><a target="_self" data-bind="text: $data.location"> </a> </h3>
    </header>
    <span data-bind="text: $data.fullDate">  </span> </article>
 </div>

!-- 代码

var viewModel = ko.observableArray();

$(document).ready(function () {
    if ($('#featured-jobs').length > 0) {
        $.ajax({

            type: 'POST',

            url: "handler/jobServer.ashx",

            data: { 'jobType': '1' },

            success: OnComplete,

            error: OnFail,

            dataType: 'json'
        });
    }
});



function OnComplete(result) {

    var self = this;
    ko.mapping.fromJS(result, {}, viewModel);

    self.fullDate = ko.computed(
  function () {
     return self.dateCreated() + " " + self.timeCreated();
  }, self); 

    ko.applyBindings(new viewModel());

}

function OnFail(result) {

    alert('Request Failed');

}

【问题讨论】：

标签： knockout.js knockout-mapping-plugin

【解决方案1】：

这是因为 onComplete 创建了一个名为 self 的新对象，它没有 dateCreated 属性。我认为您真正想要的是将计算的 observable 添加到 viewModel 中的每个项目。

编辑：

Observables 很棒，但有时它们不是答案（特别是如果一个值不太可能改变，就像我怀疑“创建日期”和“创建时间”的情况一样）。以下是我的做法（没有 observables）。 注意，你仍然可以绑定到不可观察的属性：

function OnComplete(result) {

    for (var i = 0; i < result.length; i++)
    {
        result[i].fullDate = result[i].dateCreated + " " + result[i].timeCreated;
    }

    viewModel(result);
    ko.applyBindings(viewModel);
}

如果我错了，并且用户将操纵这些值，您可以这样做（使用 observables）：

function OnComplete(result) {

    ko.mapping.fromJS(result, {}, viewModel);

    for (var i = 0; i < viewModel.length; i++)
    {
        viewModel[i].fullDate = ko.computed(
            function () {
                return this.dateCreated() + " " + this.timeCreated();
            }, viewModel[i]); 
    }

    ko.applyBindings(viewModel);
}

【讨论】：

好的。有道理。我怎么写这个？ var viewModel = ko.observableArray();
好的。有道理。 @Arbiter 我将如何写这个？我会将它添加到 viewModel 的声明中吗？我可以得到一些语法方面的帮助吗？ var viewModel = ko.observableArray();
你去吧，我已经为你扩展了我的答案。
@Arbiter，感谢您回答问题并解决了我的问题。