2016-11-28 64 views
0

我已將aurelia-validation包從0.6.0更新到0.14.0。以前它會在最接近輸入字段的標籤上顯示錯誤信息。將軟件包更新到最新版本後,標籤上不顯示錯誤消息。 。[email protected]在UI上不顯示錯誤消息

<form id="loginForm" class="form" role="form"> 
        <div class="row"> 
         <div class="form-group col-md-6"> 
          <input class="form-control" value.bind="userName" type="text" id="userName" name="username" t="[placeholder]Account.UserName" /> 
          <label t="Account.UserName" for="userName" class="control-label">User Name</label> 

         </div> 
        </div> 

        <div class="row"> 
         <div class="form-group col-md-6"> 
          <input id="txtPassword" class="form-control" type="password" value.bind="password" name="password" t="[placeholder]Account.Password" /> 
          <label for="txtPassword" t="Account.Password" class="control-label">Password</label> 
         </div> 
        </div>      
        <div class="form-group"> 
         <button id="btnLogin" class="btn btn-material-teal btn-toolbar" disabled.bind="validationController.errors.length" 
           click.delegate="login()" t="Account.Login">Log in</button> 

       </form> 

ValidationRules 。確保( '用戶名')所需的() 。確保( '密碼')所需的() 。對(本); ()=> {});這個函數返回的是一個數組。

+0

如果我的回答是正確答案,請繼續並將其標記爲已接受。謝謝! – LStarky

回答

0

我遇到了同樣的問題,它們改變了呈現驗證信息的通信方式。

error驗證對象現在是一個result對象。所以在你的渲染器中,你必須用result代替error

下一個區別是在驗證,在以前的版本this.controller.validate()返航驗證對象的array,現在它也是一個result對象,具有valid財產免遭你必須檢查。

更多細節見here

1

退房的引導形式渲染的奧裏利亞驗證文檔頁面: http://aurelia.io/hub.html#/doc/article/aurelia/validation/latest/validation-basics/8

這是旁邊顯示錶單上的每個輸入元素錯誤的最好方式。

你需要導入它是這樣的:

import { inject } from 'aurelia-dependency-injection'; 
import { ValidationControllerFactory, ValidationRules } from 'aurelia-validation'; 
import { BootstrapFormRenderer } from '../common/bootstrap-form-renderer'; 

@inject(ValidationControllerFactory) 
export class YourClassName { 

    constructor(validationControllerFactory) { 
    this.validationCtrl = validationControllerFactory.createForCurrentScope(); 
    this.validationCtrl.addRenderer(new BootstrapFormRenderer()); 
    } 
} 

ValidationRules 
    .ensure('fieldname').required() 
    .ensure('anotherfield').required.minlength(3).maxlength(20) 
    .on(this); 

你要保存BootstrapFormRenderer中的代碼,你的整個應用程序可以訪問的位置,因爲你需要將其導入到所有您需要驗證的視圖模型。