Question

我想为角形式添加自定义验证。

[self presentViewController:imagePickerController animated:YES completion:nil];

我只想要带有引号的数字或小数输入，如

<div class="form-group" ng-class="{ 'has-error': contactform.inputAmount.$invalid && submitted }">
    <label for="inputAmount" class="col-lg-2 control-label">Amount</label>
      <div class="col-lg-10">
         <textarea ng-model="formData.inputAmount" class="validate[required,custom[comment]] feedback-input" rows="4" id="comment" name="comment" placeholder="Enter Amount to Convert" required></textarea>
     </div>
</div>

如何添加此模式

帮助将受到高度赞赏。

谢谢

Answer 1

您可以使用ng-pattern验证您的textarea。

例如，这里以结帐方式。 http://www.java2s.com/Tutorials/AngularJS/AngularJS_Example/Directives/Use_ng_pattern_to_validate.htm

请参阅此处了解动态ng-pattern验证Angularjs dynamic ng-pattern validation

Answer 2

使用指令进行自定义验证。

首先编写自定义指令：

//Check For FLoat Validation
 adminApp.directive('validateFloat', function() {
 var FLOAT_REGEXP = /^\-?\d+((\.)\d+)?$/;

return {
    require: 'ngModel',
    restrict: '',
    link: function(scope, elm, attrs, ctrl) {
        // only apply the validator if ngModel is present and Angular has added the Float Number validator
        ctrl.$validators.validateFloat = function(modelValue) {
            return  ctrl.$isEmpty(modelValue) || FLOAT_REGEXP.test(modelValue);
        };

    }
};
});

在指令中使用正则表达式表示浮点（或）十进制数以 ngModel 值进行检查。

然后在html页面中使用指令。

<input type="text" name="amount" class="form-control" ng-model=test.amount" validate-float required>
                                <span class="error-container" ng-show="myForm.amount.$dirty && myForm.amount.$invalid">
                            <span ng-cloak style="color:red" ng-show="myForm.amount.$error.required">Please Enter amount</span>
                            <span ng-cloak style="color:red" ng-show="!myForm.amount.$error.required&&myForm.amount.$error.validateFloat">Enter valid amount</span>
                          </span>

在HTML页面中，提及自定义指令“validate-float”作为属性。要在 ng-Show 中显示错误消息，请提及 $ error.validateFloat 。

有关指令和验证的更多信息：https://docs.angularjs.org/guide/directive， https://docs.angularjs.org/guide/forms

向angular textarea添加自定义验证

2 个答案: