Question

我有一个功能，可以获得直到今天的天数。但它工作正常，我使用moment.js来编写和格式化JSON数据的日期，我认为这会导致冲突。有没有办法用moment.js做同样的事情？

这是有效的JavaScript：http://jsfiddle.net/infatti/XeqPT/

// Count days due
function daysUntil(year, month, day) {
  var now = new Date(),
      dateEnd = new Date(year, month - 1, day), // months are zero-based
      days = (dateEnd - now) / 1000/60/60/24;   // convert milliseconds to days

  return Math.round(days);
}

如何使用moment.js完成同样的事情？

如果有兴趣的话，这就是我如何在它不起作用时提取日期。

<span class="due-date" data-bind="textualDate: DueDate"></span>

ko.bindingHandlers.textualDate = {
    update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        var valueUnwrapped = ko.utils.unwrapObservable(valueAccessor());
        var textContent = moment(valueUnwrapped).format("MM/DD/YYYY");
        ko.bindingHandlers.text.update(element, function () { return textContent; });
    }
};

Answer 1

如果您遇到的问题是使用 moment.js 来获取两个日期之间的持续时间，那么您可以使用diff函数，如下所示：

var a = moment([2007, 0, 29]);
var b = moment([2007, 0, 28]);
var diffInMs = a.diff(b); // 86400000 milliseconds
var diffInDays = a.diff(b, 'days'); // 1 day

现在，我不知道你是否对KnockoutJS有任何问题，但这应该确保你的计算是用 moment.js 完成的。

为了您的兴趣，我自己做了一个自定义绑定处理程序，用于显示前一段时间的日期。与你的不同之处在于我的观察力已经是一个时刻的对象。所以，我在这里修改它以使其适用于标准日期对象：

    ko.bindingHandlers.moment = {
        update: function(element, valueAccessor) {
            var value = valueAccessor();
            var formattedValue = moment(ko.utils.unwrapObservable(value)).format('MM/DD/YYYY');
            $(element).text(formattedValue);
        }
    };

编辑：我通过示例为您制作了fiddle。

Answer 2

适合我 - 看到这个小提琴 - http://jsfiddle.net/tlarson/sBMTn/5。如果您能向我们展示存在问题的小提示，以便我们可以看到正在发生的事情，这可能会有所帮助。

以下是我添加的代码：

var viewModel = {
    firstDate: ko.observable("2013-7-1"),
    secondDate: ko.observable("2013-9-1")
};
ko.applyBindings(viewModel);

我更新了你的标记以使用viewmodel：

<div id="paging1">
    <ul class="list paging-items">
        <li><!-- item -->
            <h4>Due in <span class="days-due"></span> days</h4>

            <h4><span data-bind="textualDate: firstDate" class="due-date"></span></h4>
        </li><!-- #item -->
        <li><!-- item -->
            <h4>Due in <span class="days-due"></span> days</h4>

            <h4><span data-bind="textualDate: secondDate" class="due-date"></span></h4>
        </li><!-- #item -->
    </ul>
</div>

请注意，您对jQuery的each方法的调用只能对DOM中已有的数据执行操作。所以请务必在致电ko.applyBindings

后提出

...然而

您可能需要考虑使用计算而不是使用jQuery来处理页面中的“在X天内到期”部分。您可以通过以下方式执行此操作：http://jsfiddle.net/tlarson/sBMTn/1

数天直到今天moment.js

2 个答案: