2016-08-24 55 views
3

我有一個問題的錯誤消息。當輸入字段使用Angular.js獲取無效數據時,我無法顯示錯誤消息。我下面解釋我的代碼。\無法顯示使用Angular.js

<form name="billdata" id="billdata" enctype="multipart/form-data" novalidate> 
    <div ng-class="{ 'myError': billdata.type.$touched && bill data.type.$invalid }"> 
     <input type="number" class="form-control oditek-form" ng-model="type" name="type" step="1" min="0" placeholder="Add Type" ng-pattern="/^[0-9]+([,.][0-9]+)?$/"> 
    </div> 
    <div class="help-block" ng-messages="billdata.type.$error" ng-if="billdata.type.$touched"> 
     <p ng-message="pattern" style="color:#F00;">This field needs only number(e.g-0,1..9).</p> 
    </div> 
</form> 

在這裏,我只需要給出數字作爲輸入。如果用戶輸入任何內容,而不是數量應該顯示錯誤message.Here myError是否顯示在輸入的紅色邊界字段這是正確的,但消息不是應該顯示。請幫幫我。

+0

PLZ紀念你的答案,如果任何回答以下問題,幫助。 –

回答

0

ng-messages DIV應該像下面

<div ng-messages="billdata.type.$error" ng-show="billdata.type.$touched"> 
    <div ng-message when="pattern"> 
    <span>This field needs only number(e.g-0,1..9).</span> 
    </div> 
</div> 
+0

你解決了這個問題嗎? –

+0

你能告訴我你用什麼版本的ng-messages和angular? – Rakeschand

+0

也看到這個答案http://stackoverflow.com/questions/24407720/using-ngmessage-for-input-type-number – Rakeschand

1

<html> 
 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
    <div ng-app=""> 
 
    <form name="myForm">  
 
    For Text <input name="myName" ng-model="myName" ng-pattern="/^[a-zA-Z ]+$/" required>  
 
    <span style="color: red" ng-show="myForm.myName.$error.required">First Name is required.</span>                  <span style="color: red" ng-show="myForm.myName.$error.pattern">Any other symbol are not allow.</span> 
 
     
 
    <br /> 
 
     For Number 
 
     
 
     <input type="number" class="textbox_usr" name="txtmobno" id="txtmobno" ng-model="txtmobno" ng-minlength="10" ng-maxlength="10" required /><br /> 
 
                  <span style="color:red" ng-show="myForm.txtmobno.$dirty && myForm.txtmobno.$invalid"> 
 
                   <span ng-show="myForm.txtmobno.$error.required || myForm.txtmobno.$error.number">Valid Mobile number is required</span> 
 
                   <span ng-show="((myForm.txtmobno.$error.minlength || myForm.txtmobno.$error.maxlength) && myForm.txtmobno.$dirty) ">Mobile number should be 10 digits</span> 
 
                  </span> 
 
    </form> 
 
     </div>