如何从angularjs中的html页面中分离验证代码

时间:2018-05-15 11:42:26

标签: angularjs

我尝试使用ng-bind-html但是我没有得到如何从html页面分离验证代码。我需要在单独的页面中维护验证错误文件

information_schema

2 个答案:

答案 0 :(得分:0)

我不知道你想要什么,但我想你想要一个包含所有消息的独立文件。 你可以使用ng-messages-include="messages.html" 在此文件中,您可以定义"消息"用:

<ng-message when="required">{{ "ERROR_MSG_REQUIRED" | translate }}</ng-message>

答案 1 :(得分:0)

Inside your controller create a function

    $scope.validateFormField = function(userForm, fieldType ) {
       var isValid = false;
       switch(fieldType ) {
          case 'fatherOrHusbandName' : isValid =userForm.fatherOrHusbandName.$invalid && !userForm.fatherOrHusbandName.$pristine;
     break;

          case 'name': isValid = userForm.empId.$invalid && !userForm.empId.$pristine
         break;

         default : isValid = {{Do it yourself}}
         break;

       }
       return isValid ;
    }
你的HTML中的

div class="col-lg-6">
        <div class="form-group">
          <label>{{ 'EMPLOYEEID' | translate }} :</label>
          <input type="text" name="empId" class="form-control" ng-model="EmpId" placeholder="{{ 'EMPLOYEEID' | translate }}">
          <p ng-show="validateFormField(userForm, 'name')" class="help-block requiredText">{{'EMPLOYEE_ID_VALIDATE' | translate}}</p>

        </div>




        <div class="form-group">
          <label>{{ 'EMPLOYEE_NAME' | translate }} : <spn class="manadatoryIcon"> *</span></label>
          <input type="text" name="userName" class="form-control" ng-model="userName" placeholder="{{ 'EMPLOYEE_NAME' | translate }}" required>

       <div ng-messages="userForm.userName.$error">
        <p ng-bind-html="myHTML"></p>
        </div>

        </div>

        <div class="form-group">
          <label>{{ 'FATHER_HUSBAND_NAME' | translate }}:</label>
          <input type="text" name="fatherOrHusbandName" class="form-control" ng-model="fatherOrHusbandName" placeholder="{{ 'FATHER_HUSBAND_NAME' | translate }}">
          <p ng-show="validateFormField(userForm, 'fatherOrHusbandName')"" class="help-block requiredText">{{'FATHER_HUSBAND_NAME_VALID' | translate}}</p>
        </div>