Javascript 验证嵌套在另一个指令中的自定义select指令

我有两条指令：

mycustomform

和

mycustomselect

。如何触发嵌套在my custom form指令中的my custom select指令的自定义验证

Plunker

我的自定义表单指令用法：

<div ng-controller="MyExampleCtrl as exampleCtrl">
  <my-custom-form form-name="exampleForm" form-submit="exampleCtrl.submit()"></my-custom-form> 
</div>

<div class="select">
  <select ng-model="ngModel" name="{{name}}" ng-change="updateSelect()">
    <option value="" disabled>Select option</option>
    <option ng-repeat="country in countries" value="{{country.code">{{country.name}}</option>
  </select>

  <!-- how can I do something like this ? -->
  <div ng-if="required">
     <p ng-show="hasError('country')">Please select a</p>
  </div>
</div>

在我的自定义表单模板内.html

<form name="{{formName}}" novalidate>
  <div class="form-group" ng-class="{ 'is-invalid': hasError('firstName')}">
    <input type="text" ng-model="myCustomFormCtrl.data.firstName" name="firstName" required />
    <p ng-show="hasError('firstName')">Enter a first name.</p>
  </div>

  <div class="form-group">
    <!-- Nested directive here -->
    <div class="form-group">
      <my-custom-select ng-model="myCustomFormCtrl.data.country" name="country" required></my-custom-select>
    </div>

  </div>
  <button type="button" ng-click="submitMyForm()">Submit</button>
</form>

自定义选择模板内部：

<div ng-controller="MyExampleCtrl as exampleCtrl">
  <my-custom-form form-name="exampleForm" form-submit="exampleCtrl.submit()"></my-custom-form> 
</div>

<div class="select">
  <select ng-model="ngModel" name="{{name}}" ng-change="updateSelect()">
    <option value="" disabled>Select option</option>
    <option ng-repeat="country in countries" value="{{country.code">{{country.name}}</option>
  </select>

  <!-- how can I do something like this ? -->
  <div ng-if="required">
     <p ng-show="hasError('country')">Please select a</p>
  </div>
</div>

选择选项
{{country.name}
请选择一个

在这种情况下，您可以使用 指示

---

它实例化一个FormController，并允许您访问每个输入或选择子元素。

ng form解决了使用创建子表单时给定的相同表单名称调用子指令use ng form属性时验证嵌套指令的问题

子指令表

…html。。。。。

父指令表

............ 父HTML。。。。。。。。
////此live验证子指令
////这里叫child direcive

mychild指令不包含

元素。这只是一个

选择

。所以只有一种形式，你可以在一个形式里面有形式。这样它就可以通过ng表单进行验证

 <form name="bankAccountForm">
   ....html.....
 </form>

<form name="customerContractingEntityForm" ng-submit="saveCustomer()" novalidate>

  ............ parent HTML........

    <div ng-form="bankAccountForm">    //// this live validates the child directive
        <div ws-bank-account></div>    //// calling child direcive here
    </div>                
</form>