Knockout.js、映射插件和 moment.js - 格式化/映射 json 日期

我将 Knockout.js 与映射插件一起使用。我正在获取一些 json 数据并使用映射插件将其映射到我的 html 中。

json 数据中是 json 格式的日期，我需要使用映射插件将其映射到 html 中。是否可以使用 moment.js 格式化日期，然后允许映射插件将其映射到 html 中？如何获取 json 日期，将其重新格式化为可读日期并将其映射到 html 中？

// Here is my json formatted date
"DueDate":"\/Date(1362124800000)\/"

// Here's my data model
var viewModel;
$.getJSON('/myJsonData', function (data) {
    viewModel = ko.mapping.fromJS(data);
    ko.applyBindings(viewModel);

// moment.js format date from json - how can this be passed to the ko.mapping?
    var mo = moment("\/Date(1362124800000)\/").format("MMM Do YY");
});

这是一个替代答案，它利用自定义绑定 http://knockoutjs.com/documentation/custom-bindings.html。您可以像这样在视图中使用它：

<span 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("MMM Do YY");
        ko.bindingHandlers.text.update(element, function() { return textContent; });
    }
};

这很方便，因为您可以将此绑定用于所有 Date observables，而不仅仅是DueDate。例如，假设您的模型随其他日期进行扩展，您可以轻松地执行此操作，而无需修改视图模型：

<span data-bind="textualDate: StartDate"></span>
<span data-bind="textualDate: RevisedDate"></span>
<span data-bind="textualDate: DueDate"></span>
<span data-bind="textualDate: WeWillGetSuedPassedThisDueDate"></span>

您可以查看这个jsfiddle http://jsfiddle.net/mncRb/一个工作演示。