Добавление пользовательской проверки в угловую текстовую область

0

Я хочу добавить пользовательскую проверку в угловую форму.

<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>

Я хочу только числовой или десятичный ввод с инвертированными запятыми, например

"1"
"123.1"
"123.12221"

Как я могу добавить этот шаблон

Помощь будет высоко оценена.

благодаря

  • 0
    что-то вроде /^[0-9]+((\.)?[0-9]+)?$/ ?
  • 0
    где добавить этот шаблон

2 ответа

0
Лучший ответ

Используйте директиву для пользовательских проверок.

Сначала напишите специальную директиву:

//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);
        };

    }
};
}); 

В директиве используется Regex для float (или) Decimal для проверки значения 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

1

Вы можете использовать ng-pattern для проверки вашего текстового поля.

Оформить заказ здесь, например. http://www.java2s.com/Tutorials/AngularJS/AngularJS_Example/Directives/Use_ng_pattern_to_validate.htm

См. Здесь для проверки динамического ng-шаблона. Устойчивая динамическая проверка ng-шаблона Angularjs

Ещё вопросы

Сообщество Overcoder
Наверх
Меню