Javascript 自定义指令未验证表单。为什么不呢?

Javascript 自定义指令未验证表单。为什么不呢?,javascript,angularjs,validation,Javascript,Angularjs,Validation,需要进行哪些代码更改才能获得下面的自定义countparens指令,以便在表单验证期间提供下面所示的额外自定义字符串验证?当输入字段为空时,下面的代码会成功地提醒用户,但当打开的parens数(和关闭参数)不相等 我正在使用AngularJS。我曾经设计过下面的代码 以下是表单的html: <table> <tr> <td width=200> <form name="userForm" ng-submit

需要进行哪些代码更改才能获得下面的自定义
countparens
指令,以便在表单验证期间提供下面所示的额外自定义字符串验证?
当输入字段为空时,下面的代码会成功地提醒用户,但当打开的parens数
和关闭参数
不相等

我正在使用AngularJS。我曾经设计过下面的代码

以下是表单的html:

<table>
    <tr>
        <td width=200>
            <form name="userForm" ng-submit="rectangularForm(userForm.$valid)" novalidate>
                <input type="text" name="fieldname" ng-model="nameofjsontype.fieldname" required />
                <p ng-show="userForm.fieldname.$invalid && !userForm.fieldname.$pristine" class="help-block">Function is a required field.</p>
                <span ng-show="userForm.nameofjsontype.fieldname.$error.countparens">The #( != #) !</span>
                <br>
                <button type="submit" ng-disabled="userForm.$invalid" >Click to submit</button>
            </form>
        </td>
    </tr>
</table>

您的标记应该使用
userForm.fieldname.$error.countparens
来显示错误。绑定到
userForm
的字段与
ngModel
值不同。有关我的意思,请参阅

<span ng-show="userForm.fieldname.$error.countparens" class="help-block">The #( != #) !</span>

你能为你的代码提供一个plunker吗?@lebobbi我正在研究,但我以前从未使用过它。事实上,在我测试你的代码时,你这样做是为了在括号数不相等时也触发空字段警报。因此,当打开和关闭括号数不相等时,会有两条消息(这是错误的)字段为空时仅显示一条消息(正确)。我如何调整上面的代码以消除这个遗留问题?@CodeMed在这种情况下,您应该检查
必需的
验证字段
userForm.fieldname.$error.required
,而不是在
ng show
中仅检查
userForm.fieldname.$invalid
是否无效。请参阅更新的Tha我做了。谢谢你分享你的绝地知识。我提出了一个关于如何以多种形式重复使用同一指令的单独问题。你也愿意帮助我吗?以下是链接:
<span ng-show="userForm.fieldname.$error.countparens" class="help-block">The #( != #) !</span>
<input type="text" name="fieldname" ng-model="nameofjsontype.fieldname" required data-countparens=""/>
myApp.directive('countparens', function() {
    return {
      require: 'ngModel',
      link: function(scope, elm, attrs, ctrl) {
          ctrl.$validators.countparens = function(modelValue, viewValue) {
            return ctrl.$isEmpty(modelValue) ||
              ((modelValue.match(/\)/g) || []).length == (modelValue.match(/\(/g) || []).length);
          };
        }
    };
});