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

Question

我有一个简单的页面验证字段,类似这样: employee.html并验证字段但如果我添加了相同的代码并使用ng-include调用相同的页面验证不起作用

without 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 验证不起作用:

dashboard.html

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

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

Answer 1

是的，你的$submitted不工作angular version 1.3。如果您需要在仅提交表单时显示消息，那么您可以保留一个变量来检测表单是否已提交。

要做到这一点

在控制器测试功能中

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

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

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

这是正在工作的Plunker

但如果你使用的是 Angular 1.3 或更高版本

Angular$submitted在 Angular 1.3.x 中引入了一个新版本，您可能会尝试使用较旧的 Angular 版本，升级 Angular 将解决您的问题。

这是1.3 的变化- 请检查

新功能：向表单添加新的 $subscribed 状态

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

这是正在工作的笨蛋