Aurelia对话框重复验证

Question

我正在尝试使用aurelia-dialog和aurelia-validation。当我第一次打开弹出窗口并触发验证时，我得到了一个正确的错误。每当我在该事件之后重新打开弹出窗口时，我都会得到相同的验证重复两次、三次等等。

这是弹出窗口的视图模型

import { inject } from 'aurelia-framework';
import { DialogController } from 'aurelia-dialog';
import { ValidationController, ValidationRules } from 'aurelia-validation';
import { MaterializeFormValidationRenderer } from './../resources/elements/materialize-form-validation-renderer';

@inject(DialogController, ValidationController)
export class AddProject {

    rules = ValidationRules
        .ensure('name')
        .required()
        .withMessage('Please enter a name for your project.')
        .rules;

    constructor(dialogController, validationController) {
        this.name = '';
        this.project = null;
        this.dialogController = dialogController;
        this.validationController = validationController;
        this.validationController.addRenderer(new MaterializeFormValidationRenderer());
    }

    activate(project) {
        this.project = project;
    }

    detached() {
        this.validationController.reset();
    }

    validateModel() {
        return new Promise((resolve, reject) => {
            this.validationController.validate().then(v => {
                resolve(v.valid);
            });
        }, function (error) {
            reject(error);
        });
    }

    validateProject(e) {
        this.validateModel().then(valid => {
            if (valid) {
                this.project.name = this.name;
                this.name = '';
                //this.validationController.reset();
                this.dialogController.ok(this.project);
            }
        });
    }

    cancel(e) {
        this.name = '';
        //this.validationController.reset();
        this.dialogController.cancel();
    }
}

我从dialogService调用弹出窗口

import { inject } from 'aurelia-framework';
import { DialogService } from 'aurelia-dialog';

import { AddProject } from './add-project';
import { Project } from './project';

@inject(DialogService)
export class ListProjects {

    constructor(dialogService) {
        this.dialogService = dialogService;
    }

    createProject() {
        var project = new Project();
        this.dialogService.open({ viewModel: AddProject, model: project, lock: false }).whenClosed(response => {
            if (!response.wasCancelled) {
                console.log('good - ', response.output);
            }
        });
    }

}

你知道怎么重置验证吗？我尝试使用this.dialogController.cancel()，但它不起作用。

Answer 1

每次创建新的AddProject模式时，都需要使用新实例将ValidationController绑定到对话框容器上下文。

尝试添加

@inject(DialogController, NewInstance.of(ValidationController))

而不是仅仅

@inject(DialogController, ValidationController)

NewInstance可以在aurelia-dependency-injection中找到(也可以通过aurelia-framework公开)

即：import {inject, NewInstance} from 'aurelia-dependency-injection';

有关更多信息，请查看Aurelia文档中心(http://aurelia.io/hub.html#/doc/article/aurelia/validation/latest/validation-basics/12)