Question

我正在尝试扩展Aurelia Contact Manager Tutorial。具体来说：将电子邮件验证添加到contact-details.html视图。我已按照Validation: Basics文档中的示例进行操作，并在第一次传递时按预期工作：启动应用程序，从联系人列表模块中选择一个联系人，然后通过删除“@”将电子邮件更新为无效的，然后标签走了。将触发验证规则并显示错误消息。

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

我在激活联系人详细信息时尝试了validationController.reset（），虽然这会删除任何“旧”错误消息，但仍然无法启动on blur验证。

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

如果在导航到第二个联系人并“破解”验证后，我会刷新浏览器并重新加载页面，然后验证再次起作用。直到我从列表中选择另一个联系人，然后再次打破它。

我不熟悉Aurelia和JavaScript框架，我不确定这是否是一个错误，或者需要额外的东西来处理重新路由到同一页面。

Answer 1

That's a good question. There are a couple of things that may be catching you out. I've created a Gist which includes the necessary file modifications to get this working:

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

Gotchas

Because the view-model you're using for validation is not the backing view-model for the coalesce(convert(varchar(255), t1.NextScheduledClinicVisit ), 'No Next Appointment' ) as [NextScheduledVisit] view file you'll need a separate class which you'll apply the validation rules to. Although it sounds like you've already nailed this part, I'll include it for completeness. You can create this class like so:

NextScheduledClinicVisit

You can then apply the validation rules to this class as follows:

format()

The last possible missing puzzle piece here is that you'll need to hook into the screen activation life-cycle hook contact-detail.html and reset the validation context. This will force the export class Contact { email= ''; } to remove the validation styles from your view.

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

Validation Workflow

The steps are as follows:

Inject the controller
Add the validation renderer to the controller
Create the validation model (only needed if the model you want to validate is not the view-model that backs your view)
Apply the validation rules to the model
Determine when to re-set and execute the validation (in this case on the deactivate() life-cycle hook.
Apply the validation binding behavior to the view

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

1 个答案: