角度表单验证不起作用
问题描述:
对于Angular来说,我很新,尝试构建注册表单后,在查看构建此表单的教程后,我们对其进行了验证。角度表单验证不起作用
这里是我使用的代码:
<div class="signup-cont cont form-container" ng-controller="signinSignUpController">
<form id="login-form" name="signUpForm" ng-submit="submitForm(signUpForm.$valid)" novalidate>
<div class="form-group" ng-class="{ 'has-error' : signUpForm.name.$invalid && !signUpForm.name.$pristine }">
<input type="name" name="name" id="usr-name" class="inpt form-control" placeholder="Your name" ng-model="name" ng-required="true"/>
<label class="control-label" for="name">Your name</label>
<span class="glyphicon glyphicon-remove form-control-feedback" ng-show="submitted && signUpForm.name.$invalid "></span>
<p ng-show="submitted && signUpForm.name.$invalid" class="help-block">You name is required.</p>
</div>
<div class="form-group" ng-class="{ 'has-error has-feedback' : submitted && signUpForm.email.$invalid}">
<label class="control-label" for="email">Your email</label>
<input type="email" name="email" class="inpt form-control" ng-model="email" placeholder="Your email" ng-required="true"/>
<span class="glyphicon glyphicon-remove form-control-feedback" ng-show="submitted && signUpForm.email.$invalid"></span>
<p ng-show="submitted && signUpForm.email.$invalid" class="help-block">Enter a valid email.</p>
</div>
<div class="form-group" ng-class="{ 'has-error has-feedback' : submitted && signUpForm.password.$invalid}">
<label class="control-label" for="password">Your password</label>
<input type="password" name="password" class="inpt form-control" ng-model="password" placeholder="Your Password" ng-required="true"/>
<span class="glyphicon glyphicon-remove form-control-feedback" ng-show="submitted && signUpForm.password.$invalid"></span>
<p ng-show="submitted && signUpForm.password.$invalid" class="help-block">Enter a valid email.</p>
</div>
<div class="submit-wrap">
<input type="submit" class="form-control submit-signup btn btn-black-border btn-default" ng-disabled="signUpForm.$invalid" value="SIGN UP"/>
<a href="#" class="more">Terms and conditions</a>
</div>
</form>
</div>
是否有人可以帮助我了解,我做错了。
答
将ng-model =“name”改为ng-model =“user.name”,ng-model =“password”改为ng-model =“user.password”和ng-model =“email”改为ng -model = “user.email”。
我检查使用plunker它的工作正常。
答
ng-show="submitted && signUpForm.name.$invalid"
submitted
究竟是什么?如果这是控制器中的东西,似乎它被设置为假&未通过验证。看看这个plunk没有提交的标志。
发布您的js代码。也尝试使它在一个普及。 – rakemen