追踪aurelia中模型变化的最佳方法是什么?

时间:2015-12-09 06:06:34

标签: aurelia aurelia-binding aurelia-validation

我有简单的要求让我们举个例子

EX1: 在“我的视图”中,我有两个输入字段 名字和姓氏和一个按钮提交以保存名字和姓氏。 现在我希望只有当名字和姓氏值发生任何变化时才会启用我的提交按钮。

EX2: 在“我的视图”中,我有两个输入字段 名字和姓氏和一个按钮提交以保存名字和姓氏。 现在,这里的第一个名字和姓氏来自我的视图模型。如果我更改了名字和姓氏的任何内容我的提交按钮被启用,现在再次如果我将名字和姓氏的先前值设置为我的提交按钮被禁用。

<template>
    <form role="form" submit.delegate="SaveDetail()" validate.bind="validation">
        <div class="form-group">
            <label>First Name</label>
            <input type="text" value.bind="firstName" class="form-control">
        </div>
        <button class="btn btn-success" type="submit" disabled.bind="!validation.result.isValid">save</button>
    </form>
</template>

import {inject} from 'aurelia-framework';
import {Validation} from 'aurelia-validation';
@inject(Validation)
export class ChildRouter {
    firstName: string = 'pranay';
    validation;
    constructor(Validation) {
        var self = this;
        self.validation = Validation.on(self)
            .ensure('firstName')
            .isNotEmpty()
            .hasMinLength(3)
            .hasMaxLength(10)
            .isNotEqualTo(self.firstName);
    }

    SaveDetail() {
        var self = this;
        self.validation.validate() 
            .then(() => {
                alert(self.firstName);
            });
    }
}

请让我知道此类情景的最佳方法。

1 个答案:

答案 0 :(得分:2)

尝试追踪“肮脏的”&#39;验证规则isNotEqualTo(oldValue)的值,只检查结果是否有效。

<button disabled.bind="validation.result.isValid"></button>

更新:但是当刷新模型时,就像保存后一样,验证对象也应该重新初始化。同样对于早期版本,建议致电this.formValidation.destroy();,不确定现在是否需要它。