Aurelia驗證規則（綁定到模型）在隨後激活視圖模型時不會觸發

Question

我正在嘗試擴展Aurelia Contact Manager Tutorial。具體而言：將電子郵件驗證添加到contact-details.html視圖。我也跟着Validation: Basics文檔中的例子，在第一次傳和預期一樣：啓動應用程序，從聯繫人列表模塊的聯繫人，然後更新電子郵件的東西通過刪除無效的「@」，然後標籤了。驗證規則觸發並顯示錯誤消息。

然而，如果啓動應用程序後，我選擇的第一接觸之後的第二，因此觸發接觸細節模塊的第二激活，則驗證規則不觸發。

我試圖在接觸細節的激活validationController.reset（），雖然這將消除任何「老」的錯誤信息，在上模糊的驗證仍然不火。

我試圖創建驗證控制器（使用NewInstance.of（ValidationController）與ValidationControllerFactory）的兩種不同的方法但兩者產生相同的結果。

如果導航到第二接觸和「破」的驗證後，我再刷新瀏覽器並重新加載頁面，則再次驗證工作。直到我從列表中選擇另一個聯繫人，然後再重新打開它。

我是Aurelia和JavaScript框架的新手，我不確定這是一個錯誤還是需要額外處理重新路由到同一頁面。

Answer 1

這是一個很好的問題。有幾件事情可能會把你趕出去。我創建了一個要點，其中包括必要的文件修改得到這個工作：

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

陷阱

由於您使用的驗證視圖模型不背視圖 - 模型contact-detail.html視圖文件，您將需要一個單獨的類，您將應用驗證規則。雖然聽起來你已經完成了這部分，但我會將其完整包含在內。你可以創建這個類，像這樣：

export class Contact { 
    email= ''; 
} 

您可以再申請驗證規則這一類，如下所示：

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

最後可能缺少的拼圖塊這裏是你需要掛鉤進入屏幕激活生命週期鉤子deactivate()並重置驗證上下文。這將迫使BootstrapValidationRenderer從您的視圖中刪除驗證樣式。

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

驗證工作流程

的步驟如下：

1. 注入控制器
2. 添加validation renderer控制器
3. 創建驗證模型（只需要當您要驗證的模型不是支持您視圖的視圖模型）
4. 將validation rules應用於模型
5. 確定何時重新設置並執行驗證（在本例中爲deactivate生命週期鉤子。
6. 應用validation binding behavior到視圖