使用knockout.js和moment.js时的日期无效

Question

我将Knockout与moment.js和C#结合使用.在C#中,我使用以下命令传递ISO格式的日期:var jsonString = JsonConvert.SerializeObject(dataObject},new IsoDateTimeConverter());

在我的HTML文件中,我正在执行以下操作以格式化方式显示我的日期:

<script type="text/javascript">
var viewModel = {};
$.getJSON("http://www.test.com/jsonfile.txt", function(data) { 
viewModel.model = ko.mapping.fromJS(data);
ko.applyBindings(viewModel);
});
</script>
<div>Hello</div>
<div>Time: <span data-bind="text: moment(model.Time).format('L')"></span></div>

我总是得到无效的日期,但当我使用时:

<div>Time: <span data-bind="text: model.Time"></span></div>

它只是正确显示时间:2014-08-25T09:49:00

谁知道我做错了什么？

Answer 1

fromJS创建可观察对象,model.Time函数也是如此.所以:

<span data-bind="text: moment(model.Time()).format('L')"></span>
<!-- Change is here --------------------^^                   -->

但KO方式可能是为此创建一个计算的observable:

<script type="text/javascript">
var viewModel = {};
$.getJSON("http://www.test.com/jsonfile.txt", function(data) { 
    viewModel.model = ko.mapping.fromJS(data);
    viewModel.model.FormattedTime = ko.computed(function() {
        return moment(viewModel.model.Time()).format('L');
    });
    ko.applyBindings(viewModel);
});
</script>
<div>Hello</div>
<div>Time: <span data-bind="text: model.FormattedTime"></span></div>

或者更好的是,你自己的绑定:实例

ko.bindingHandlers.formattedTime = {
  update: function(element, valueAccessor) {
    $(element).text(moment(ko.unwrap(valueAccessor())).format('L'));
  }
};

然后:

<div>Time: <span data-bind="formattedTime: model.Time"></span></div>