在 Typescript 类中访问 jquery 验证变量
目前我正面临以下问题,希望有人能帮我:
我正在使用 TypeScript 开发一个 aurelia-cli 应用程序。在我看来,aurelia-validation 并不是很好,而且过于复杂。所以我正在使用 jQuery-Validation。
我有以下类:
export class RegistrationForm{
@bindable errors: string[];
public attached(){
let validator = $("#registration-form").validate({
onfocusout: function (element) {
$(element).valid();
},
errorPlacement: function(error, element){
this.errors.push(error.text());
}
});
}
}
以及以下模板:
<template>
...
<ul if.bind="errors">
<li repeat.for="error of errors">
${error}
</li>
</ul>
...
</template>
我知道,所示例子中使用 this.errors.push(error.text()) 是错误的,因为在那一刻我无法访问类变量 errors。
现在我的问题是,是否有可能将 error.text() 的信息传输到类变量,这样文本就可以在前端列出?
我的目标是,每次用户更改字段(失去焦点时),相应的字段都会被验证,并在页面顶部显示一条消息。显示应与 aurelia-binding 一起使用。
有人有办法解决这个问题吗?
答案#1
将你的 function() 改为箭头函数 =>,因为它们会保留声明时的作用域,因此 this 指向类而不是函数。
export class RegistrationForm{
@bindable errors: string[];
public attached(){
let validator = $("#registration-form").validate({
onfocusout: (element) => {
$(element).valid();
},
errorPlacement: (error, element) => {
this.errors.push(error.text());
}
});
}
}
