angularjs - 如果在 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验证不起作用:

仪表板.html

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

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

Answer 1

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

要做到这一点

在 Controller 测试功能中

$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 将解决您的问题。

这是 Changes of the 1.3 - 请检查

new feature: Add new $submitted state to forms

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

这是工作 plunker