表单输入长度从下拉列表验证

Question

选择的项目我有以下形式，我试图验证以下表格状态：

THEMENAME必须是必要的，应该有分钟。 4个字符。 themeLang从选定的值不能相同themeLangTo（反之亦然）。

我想在每个无效字段下显示跨度错误消息。

我试图这样做，但我无法解决它与选择输入。

有人可以告诉我如何以正确的方式做到这一点吗？

表单代码：

<ul class="nav nav-pills pull-right"> 
    <li><a href="" ng-click="showModalNewTheme()">Close form</a></li> 
</ul> 
<h3 class="text-muted">Add New Theme</h3> 

<form role="form" name="addThemeForm" id="addThemeForm" > 
    <div class="form-group"> 
     <label for="themeName">Theme name:</label> 
     <input id="themeName" type="name" required class="form-control" ng-minlength="4" ng-model="newtheme.name" placeholder="Enter Theme Name"> 
     <span class="formValidationError" ng-show="addThemeForm.themeName.$error">Enter valid e-mail</span> 
    </div> 


    <div class="form-group"> 
     <label for="themeLangFrom">Language from:</label> 
     <select id="themeLangFrom" required class="form-control" ng-options="language as language.name for language in languages" ng-model="newtheme.langFrom" > 
      <option value="">{{language.name}}</option> 
     </select> 
    </div> 


    <div class="form-group"> 
     <label for="themeLangTo">Language to:</label> 
     <select id="themeLangTo" required class="form-control" ng-options="language as language.name for language in languages" ng-model="newtheme.langTo" > 
      <option value="">{{language.name}}</option> 
     </select> 
    </div> 

    <input ng-click="addTheme(newtheme)" ng-disabled="!addThemeForm.$valid" type="submit" value="Add New Theme" class="btn btn-success btn-block btn-lg"> 
</form> 

Answer 1

为了验证themeLangFrom为themeLangTo diferent你将需要实现自定义指令。

您可以使用角UI的ui-validate指令（http://angular-ui.github.io/ui-utils/）为或proabbly更好：

推出自己的...你可以从密码验证指令那里的许多实现采取例如刚刚注意到，不像密码验证你需要的字段不相等。

你可以在这里看到一些例子：password-check directive in angularjs