AngularJs ng消息無法正常工作

我想在AngularJs 1.6.4中使用ng消息進行驗證。AngularJs ng消息無法正常工作

但是，只要我在窗體中輸入它會顯示所有3個ng消息，之後它們將不會消失，直到頁面刷新。所以即使沒有達到最大長度，它也會顯示「你的名字是必需的」。

<form name="userForm" ng-submit="signup(userForm.$valid)" novalidate> 

    <!-- First name --> 
    <div class="form-group" ng-class="{ 'has-error' : userForm.first_name.$touched && userForm.first_name.$invalid }"> 

     <label for="example-text-input" class="col-2 col-form-label">First Name</label> 
     <div class="col-10"> 

     <input class="form-control" type="text" placeholder="Please enter your first name" 
      name="first_name" 
      ng-model="user.first_name" 
      ng-minlength="2" 
      ng-maxlength="25" 
      required> 

     <div class="help-block" ng-messages="userForm.first_name.$error" ng-if="userForm.first_name.$touched"> 
      <p ng-message="minlength">Your name is too short.</p> 
      <p ng-message="maxlength">Your name is too long.</p> 
      <p ng-message="required">Your name is required.</p> 
     </div> 

     </div> 
    </div> 
</form>

編輯

通過將ngMessages到我的模塊，並在我的index.html完美添加腳本標籤

來源

2017-04-22 Soundwave

您的代碼工作，爲我解決了這個問題。檢查plunker鏈接

Injecte ngmessage在您需要的模塊。

angular.module('app', ['ngMessages'])

在項目中添加角度消息文件。

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular‌-messages.js"></scri‌pt>

來源

2017-04-22 11:16:22

讓我知道爲什麼它was't爲你工作 –

這真是奇怪，因爲它不是在我的項目。 – Soundwave

我沒有，現在我做了，但現在一切都停止工作。現在角度不能正確加載。 – Soundwave

    <input class="form-control" type="text" placeholder="Please enter your first name" 
     name="first_name" 
     ng-model="user.first_name" 
     minlength="2" 
     maxlength="25" 
     ng-required="true"/> 

       <div ng-messages="userForm.first_name.$error" ng-show="userForm.first_name.$touched" > 
        <span ng-message="required" class="error">Required</span> 
        <span ng-message="minlength">Minimum 2</span>

最大25

    </div>

來源

2017-04-22 18:48:28 twitch

AngularJs ng消息無法正常工作

回答

相關問題