2016-12-14 73 views
0

我想验证模板本身的输入。AngularJS在模板上验证

与NG秀跨度当输入有效它不显示

我有想法我在做什么错在这里:

<form name="registerForm" class="js-validation-register form-horizontal push-50-t push-50"> 
    <div class="form-group"> 
     <div class="col-xs-12"> 
      <div class="form-material form-material-primary"> 
       <input class="form-control" type="text" id="username" name="username" placeholder="Please enter a username" ng-required="true"> 
       <label for="username"> 
        <span ng-show="registerForm.username.$valid" class="text-success"><i class="fa fa-check-circle"></i></span> 
        Username 
       </label> 
      </div> 
     </div> 
    </div> 
</form> 

请你帮忙

+0

你能不能给我们带来什么不工作或不表现为您所期待的一些线索? – Lex

+0

对不起,刚刚编辑.. –

+0

@ OzBar-Shalom你检查了我的答案吗? –

回答

1

你忘了在Y添加ng-model我们的投入。

工作演示:

var myApp = angular.module('myApp',[]); 
 

 
myApp.controller('MyCtrl',function($scope) { 
 
    
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    <form name="registerForm" class="js-validation-register form-horizontal push-50-t push-50"> 
 
    <div class="form-group"> 
 
     <div class="col-xs-12"> 
 
      <div class="form-material form-material-primary"> 
 
       <input class="form-control" type="text" id="username" name="username" placeholder="Please enter a username" ng-model="username" ng-required="true"> 
 
       <label for="username"> 
 
        <span ng-show="registerForm.username.$valid" class="text-success">username is valid</span> 
 
        Username 
 
       </label> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</form> 
 
</div>

1

您需要到NG-模式添加到您的输入

<input class="form-control" ng-modal="modal" type="text" id="username" name="username"placeholder="Please enter a username" ng-required="true">