如果在ng-include中，验证不起作用

I have a simple page with validating the field, something like this: employee.html and its validating the field but if I have added the same code and called the same page using ng-include the validating is not working

我有一个简单的页面,用于验证字段,如下所示:employee.html及其验证字段,但如果我添加了相同的代码并使用ng-include调用相同的页面,则验证不起作用

without ng-include validate works:

没有ng-include验证工作:

 <form name="form" class="form-horizontal" ng-validate="create(data)" novalidate>
   <div class="row">
       <div class="col-xs-6">
           <div class="form-group">
               <label for="" class="col-xs-6 control-label">First Name:</label>
                  <div class="col-xs-6">
                     <input name="first_name" type="text" class="form-control" ng-model="data.first_name" placeholder="First name" ng-required="true">
                        <div class="alert alert-danger" ng-show="form.$submitted && form.first_name.$error.required">Enter first name.</div>
                  </div>
            </div>
       </div>
   </div>
</form>

with ng-include validate does not works:

使用ng-include验证不起作用:

dashboard.html

<div class="container">
     ....................
     ..................
     <ng-include src="employee.html"></ng-include>         
</div>

my question is: how can I make the validation works within ng-include?

我的问题是:如何在ng-include中进行验证?

3 个解决方案

#1

yes your $submitted is not working angular version 1.3. if you need to show the message if only form is submit then you can keep a variable to detect whether the form is submitted or not.

是的,你提交的$不是工作角度版本1.3。如果只需要提交表单就需要显示消息,那么您可以保留一个变量来检测表单是否已提交。

to do that

要做到这一点

in controller test function

在控制器测试功能

$scope.create = function(data) {
     $scope.formSubmitted = true;
}

in validation message use formSubmitted instead of $submitted

在验证消息中使用formSubmitted而不是$ submitted

<div class="alert alert-danger" ng-show="formSubmitted && form.first_name.$error.required">E..

here is the working Plunker

这是工作的Plunker

But if you are using angular 1.3 or later version

但是,如果您使用的是角1.3或更高版本

angular introduce a $submitted in angular 1.3.x and may be your trying with a older angular version, upgrading angular will solve your problem.

角度介绍一个$ 1.3角度提交,可能是你尝试使用较旧的角度版本,升级角度将解决您的问题。

here is the Changes of the 1.3 - please check the

这里是1.3的变化 - 请检查

new feature: Add new $submitted state to forms

新功能:向表单添加新的$ submit状态

<div class="alert alert-danger" ng-show="form.$submitted && form.first_name.$error.required">Enter first name.</div>

here is the working plunker

这是工作的plunker

#2

You can use bootstrap validation in ui like that

你可以在ui中使用bootstrap验证

<form name="personalinformation">

<label for="fname">  First Name<span style="color:red" ng-show="personalinformation.firstname.$error.required">*</span></label>  
<input type="text" class="form-control" id="" placeholder="First    Name" ng-model="PerInfo.FirstName" required name="firstname">

</form>

and if you validation by angular you can create validationFunction and ng-click pass the value of text or other element in controller.If input type is false then you cal fill value in ng-show="true"

如果你通过angular验证你可以创建validationFunction和ng-click传递文本或控制器中的其他元素的值。如果输入类型为false,那么你在ng-show =“true”中填充值

#3

Use <ng-form></ng-form> instead of <form></form>

使用代替

#1