Aurelia 验证规则（绑定到模型）不会在随后激活视图模型时触发

Question

我正在尝试扩展 Aurelia Contact Manager Tutorial. Specifically: adding email validation to the contact-details.html view. I have followed the examples in the Validation: Basics 文档，并且在第一次通过时它按预期工作：启动应用程序，select 来自联系人列表模块的联系人，然后将电子邮件更新为某些内容删除'@'无效，然后离开。验证规则触发并显示错误消息。

但是，如果在启动应用程序后我 select 第一个联系人然后是第二个联系人，因此触发了联系人详细信息模块的第二次激活，则验证规则不会触发。

我已尝试 validationController.reset() 激活联系方式，虽然这会删除任何 'old' 错误消息，但仍然不会触发模糊验证。

我已经尝试了两种不同的创建验证控制器的方法（使用 NewInstance.of(ValidationController) 与 ValidationControllerFactory），但都产生了相同的结果。

如果在导航到第二个联系人并 'breaking' 验证后，我刷新浏览器并重新加载页面，然后验证再次工作。直到我从列表中选择另一个联系人，然后再次中断它。

总的来说，我是 Aurelia 和 JavaScript 框架的新手，我不确定这是一个错误还是需要一些额外的东西来处理重新路由到同一页面。

Answer 1

这是个好问题。有几件事可能会让你失望。我创建了一个要点，其中包含必要的文件修改以使其正常工作：

https://gist.github.com/freshcutdevelopment/170c2386f243e7095e276811dab52299

陷阱

因为您用于验证的视图模型不是 contact-detail.html 视图文件的支持视图模型，您需要一个单独的 class 来应用验证规则到。尽管听起来您已经掌握了这一部分，但为了完整起见，我还是将其包括在内。您可以像这样创建 class：

export class Contact {
  email= '';
}

然后您可以将验证规则应用于此 class，如下所示：

  ValidationRules
  .ensure(a => a.email).required().email()
  .on(Contact);

这里最后一个可能遗漏的拼图是您需要挂接到屏幕激活生命周期挂钩 deactivate() 并重置验证上下文。这将强制 BootstrapValidationRenderer 从您的视图中删除验证样式。

  deactivate(){
    this.controller.reset();
  }

验证工作流程

步骤如下：

注入控制器
将validation renderer添加到控制器
创建验证模型（仅当您要验证的模型不是支持您的视图的视图模型时才需要）
将 validation rules 应用于模型
确定何时重新设置和执行验证（在本例中是在 deactivate 生命周期挂钩上。
将validation binding behavior应用到视图

Aurelia 验证规则（绑定到模型）不会在随后激活视图模型时触发

Aurelia Validation rule (bound to model) does not fire on subsequent activations of a view model

aurelia