使用关联数组中的其他项计算值

Question

这几天我一直在努力解决这个问题，希望大家能提供帮助。

我正在尝试将动态值存储在关联数组中，该数组使用同一数组中的其他 2 个值计算得出。

代码如下：

model.TimeLog = {
 StartTime: "2015-01-01T00:00:00",
 EndTime: "2015-01-01T00:00:00",
 TimeDifference: ko.pureComputed(function() {
  var from = StartTime() || "2015-01-01T00:00:00";
  from = new Date(from);
  var to = EndTime() || "2015-01-01T00:00:00";
  to = new Date(to);
  var difference;
  if ((to - from) >= 0)
    difference = to - from;
  else
    difference = 0;
  var timespan = +(difference / 1000 / 60 / 60).toFixed(2);
  return timespan;
 })
}

--------- Section of the HTML page referenced later -------------

<td><input type="text" data-bind="event {onchange: $root.calculateTimeSpan(this,EndTime)}"></input></td>
<td><input type="text" data-bind="event {onchange: $root.calculateTimeSpan(StartTime,this)}"></input></td>

目标是让用户选择开始时间和结束时间（使用日期/日历选择器），然后在编辑任一日期字段时将时差（以小时为单位）显示到只读字段。

至于我为什么要尝试在此模型视图中完成该功能，而不是直接在页面上或在单独的脚本文件中，是因为在页面上可以有此模型的多个实例，我需要在每个实例。

其他一些可能有帮助的信息：

• 网页在 HTML5 上运行，没有旧版本
• 淘汰赛JS v3.3.0
• 专为最新版本的 Chrome 和 Firefox 设计；没有IE

我希望这对你们来说已经足够了。如果没有，请告诉我，我会尽力提供。

更新

• 问题是只读字段中不显示任何值。后端没有错误，浏览器中唯一的错误是“ReferenceError: StartTime is not defined”
• 我相信 StartTime 和 EndTime 是全局变量。访问模型后我可以在其他文件中访问它们，即model.StartTime

我尝试过的事情

• 我没有在模型上运行函数，而是尝试在 html 页面上对函数进行数据绑定（使用单独的 javascript 文件）（参见上面的部分）

注意：html 页面使用了一些我无法发布代码的自定义构建标签。要访问我的 javascript 文件中的函数，我需要使用“$root.[function]”。无需使用 'model.[key]' 即可访问“模型”中的任何值。

由于我无法发布 html 页面呈现方式的代码示例或屏幕截图，我将描述我正在使用的功能：

在我正在处理的视图中，有一个模型实例的集合/列表。默认情况下不显示输入字段，并且始终有一个按钮固定在页面底部，允许用户生成模型的新实例。当用户创建一个新实例时，该模型的实例存储在一个数组中，在我的例子中它被称为 TimeLogGroup。当用户去保存页面时，这个组 TimeLogGroup 被传递到后端存储在数据库中。

所以为了重申这个问题，参考上面的段落，在模型的每个实例上都有一个开始和结束时间，我需要在不可编辑/只读字段中计算和显示时间跨度。我有计算、测试和尝试的代码，但无法在必填字段中显示值。

我希望这能进一步帮助你们。

Answer 1

只有当它访问的 observables 更新时，你的计算值才会更新。您需要 StartTime 和 EndTime 是可观察的。您还需要使用它们的限定名称来引用它们。

更新：哦，我忘记了计算必须在对象之外定义，因为它将在创建时进行评估，并且对象成员将不存在。

model.TimeLog = {
 StartTime: ko.observable("2015-01-01T00:00:00"),
 EndTime: ko.observable("2015-01-01T00:00:00")
};
model.TimeLog.TimeDifference = ko.pureComputed(function() {
  var from = new Date(model.TimeLog.StartTime());
  var to = new Date(model.TimeLog.EndTime());
  var difference;
  if ((to - from) >= 0)
    difference = to - from;
  else
    difference = 0;
  var timespan = +(difference / 1000 / 60 / 60).toFixed(2);
  return timespan;
 });