我正在尝试手动验证通过customEvent更新的对象。
//home.html
<type-ahead change.delegate="updateValue($event.detail, true/false)"></type-ahead>
我有上述两个元素,我想根据一个布尔值将它们分配给origin
和destination
的属性。
我还想针对相同的自定义规则来验证这两个属性,该自定义规则是我在下面的视图模型中的setupValidation
中定义的。
这两个都是对象,需要进行一些复杂的验证(出于演示目的,我对其进行了简化),因此我使用了.ensureObject()
并将这两个对象手动添加到验证控制器中。
我希望我只需要添加一次对象(在我最初的setupValidation()
期间),但是我发现必须删除该对象,然后每当将对象重新添加到验证控制器中时变化。
如果您查看updateValue(...)
,将会看到我期望this.destination
对更新后的对象进行验证,但是我看到的结果仍然是null
。但是,this.origin
确实会更新,并且验证成功(因为我正在手动更新控制器)。
我希望不必手动更新控制器。这是预期的吗?
//home.ts
@autoinject
export class Home {
origin = null;
destination = null;
private controller: ValidationController;
public canSubmit: boolean = false;
public error: string;
private rules;
constructor(controllerFactory: ValidationControllerFactory) {
this.controller = controllerFactory.createForCurrentScope();
this.controller.validateTrigger = validateTrigger.manual;
}
bind() {
this.setupValidation();
}
private validate() {
this.controller.validate()
.then(results => {
this.canSubmit = results.valid;
});
}
private setupValidation() {
ValidationRules.customRule(
'rule1',
(value) => {
if(value.property && value.property.length === 3)
return true;
else
return false;
},
`\${$displayName} must be 3 characters long`
);
this.rules = ValidationRules
.ensureObject()
.required()
.satisfiesRule('rule1')
.rules;
this.controller.addObject(this.origin, this.rules);
this.controller.addObject(this.destination, this.rules);
}
updateValue(newValue, isOrigin) {
if(isOrigin) {
this.controller.removeObject(this.origin);
this.origin = newValue;
this.controller.addObject(this.origin, this.rules);
}
else
this.destination = newValue;
this.validate();
}
}
谢谢,让我知道是否需要其他详细信息。