[英]asp.net mvc spa durandaljs date format not working with Knockout
我正在為ASP.NET MVC SPA探索durandaljs。 我正在使用APS.net MVC4,Durandaljs,Knockoutjs,微風,moment和在hotwelwel SPA示例下找到的其他庫。
我有一個與DOB,DateTime綁定的客戶端視圖。
<td colspan="2">
<span id="dob" data-bind="text: DOB"></span>
</td>
我的ViewModel包含代碼
vm.studentProfile().DOB(moment(vm.studentProfile().DOB()).format('L'));
logger.log(vm.studentProfile().DOB(), null, system.getModuleId(vm), false);
上面的代碼實際上來自querySucceeded。 即
return manager
.executeQuery(query)
.then(querySucceeded)
.fail(queryFailed);
這應該是可行的,因為我已經在其他一些字段中實現了這一點,但是在DateTime的情況下,KnockoutOut不會更新GUI,而我可以在控制台日志中看到UPDATED格式的日期。 有人可以告訴我我在這里想念什么。 提前致謝。
問題可能在於DOB是MomentJs
日期,而不是JavaScript Date
或字符串。 您很可能需要添加自定義綁定處理程序以顯示這些日期,例如:
ko.bindingHandlers.moment = {
update: function(element, valueAccessor) {
var value = valueAccessor();
var formattedValue = ko.utils.unwrapObservable(value).format('LLLL');
$(element).text(formattedValue);
}
};
現在,不使用“文本”綁定處理程序,而是使用“矩”綁定處理程序,如下所示:
<span id="dob" data-bind="moment: DOB"></span>
編輯:添加了使用帶有RequireJS的AMD模塊添加自定義插件的示例:
require(['jquery', 'json2', 'sammy', 'amplify', 'bootstrap', 'moment', 'toastr', 'showdown', 'markdowneditor', 'spin'],
function($){
// Require that plugins be loaded, after the prerequisite libraries
// We load the plugins here and now so that we don't have to
// name them specifically in the modules that use them because
// we don't want those modules to know that they use plugins.
requirejs([
'jquery.ui', // jquery plugin
'jquery.mockjson', // jquery plugin
'jquery.tmpl', // jquery plugin
],
function () {
require(['ko'],
function(ko) {
// ensure KO is in the global namespace ('this')
if (!this.ko) {
this.ko = ko;
};
requirejs([
'libs/knockout.binding.handlers', // Knockout custom binding handlers
'libs/knockout.extenders', // Knockout custom binding handlers
'libs/bootstrap.extenders', // Knockout custom binding handlers
],
// Plugins generally don't return module objects
// so there would be point in passing parameters to the function
function () {
require(['app'], function(App) {
App.initialize();
});
}
);
}
);
}
);
}
);
怎樣做一個ko呢?
vm.studentProfileFormatted = ko.computed({
read: function () {
return moment(vm.studentProfile().DOB()).calendar();
},
write: function (value) {
var time = moment(value, "MM-DD-YYYY").toJSON();
vm.studentProfile(time);
},
owner: vm
});
然后在您的視圖中調用studentProfileFormatted。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.