define(['durandal/app', 'jquery'], function (app) {
return {
self: this,
title: 'Client Data',
canSubmit: ko.observable(false),
personalNumber: ko.observable().extend({
required: true,
minLength: 11,
maxLength: 11
}),
documentNumber: ko.observable(),
documentType: ko.observable(),
country: ko.observable(),
firstName: ko.observable(),
middleName: ko.observable(),
lastName: ko.observable(),
citizenship: ko.observable(),
age: ko.observable(),
sex: ko.observable(),
city: ko.observable(),
currentAddress: ko.observable(),
registrationAddress: ko.observable(),
phone: ko.observable(),
mobile: ko.observable().extend({
required: true
}),
email: ko.observable().extend({
email: true
}),
canSubmit: function(){
app.trigger('formIsValid:event', self.errors().length == 0);
return self.errors().length == 0;
},
validate: function () {
if (!self.canSubmit()) self.errors.showAllMessages();
},
compositionComplete: function () {
//alert(apiLocation());
$(document).on("keydown", ".personalID", function (k) {
if(k.keyCode == 13)
$(this).blur();
})
$(document).on("change", ".personalID", function () {
});
},
errors: ko.validation.group(self),
deactivate: function () {
self = null;
},
};
当我离开这个构图时,它仍然保留输入中的数据。我怎样才能让观察者在我离开后不记住价值观,所以当我再次推出这个作品时,它会很清楚
答案 0 :(得分:2)
只需在viewModel(模块)定义函数中返回构造函数而不是对象。
define(['durandal/app', 'jquery'], function (app) {
var vm = function(){
var self = this;
this.title= 'Client Data';
this.canSubmit = ko.observable(false);
//... properties
this.canSubmit = function(){
app.trigger('formIsValid:event', self.errors().length == 0);
return self.errors().length == 0;
}
//... methods
};
return vm;
};
这样,每次激活viewmodel时,都会创建一个新实例。如果出于某种原因需要单例,则应在停用时添加额外的逻辑以清除值。
你真的需要一个单身人士吗?
编辑:
define(['durandal/app', 'jquery'], function (app) {
var vm = function(){
var self = this;
this.title= 'Client Data';
this.canSubmit = ko.observable(false);
this.model = ko.validatedObservable({
personalNumber: ko.observable().extend({
required: true,
minLength: 11,
maxLength: 11
}),
documentNumber: ko.observable(),
documentType: ko.observable(),
country: ko.observable(),
firstName: ko.observable(),
middleName: ko.observable(),
lastName: ko.observable(),
citizenship: ko.observable(),
// .....
});
this.errors = ko.validation.group(this.model);
this.mustValidate = ko.observable(true);
//... add the properties
this.canSubmit = function(){
app.trigger('formIsValid:event', self.errors().length == 0);
return self.errors().length == 0;
}
//... add the methods
};
return vm;
};
然后在您的UI中,您可以将某个区域与模型绑定,并使用$ parent使用属于viewmodel的函数或属性:
<form data-bind="with: model">
<input data-bind="value: personalNumber" type="text"/>
<button data-bind="click: $parent.submit, visible: $parent.canSubmit() />
</form>
基本上,只需应用MVVM,模型 - 视图 - ViewModel。你要做的是创建一个也像ViewModel一样的超级模型。
答案 1 :(得分:-1)
您可以使用activate事件设置初始值
activate: function () {
this.phone("");
this.citizenship("");
//....
},
修改强>
其他选项是手动实例化视图模型,
define(['durandal/app', 'jquery'], function (app) {
var ctor=function(){
this.phone("");
//...
}
return ctor;
});
在父视图模型中实例化新模型
activate:function{
this.myViewModel=new myViewModel();
}
然后在HTML中指定视图模型实例
data-bind="compose: { model:myViewModel, view:'myView.html' }"