Question

你是角js的新手吗？一旦用户输入十进制值或字符串显示角度js中的错误，如何仅在texbox中允许数字？

 <div class="col-md-6 col-sm-6"> 
                                                        <label class="col-md-5 col-sm-5 pad-top5 pad-lft-no">Min <span class="error">*</span></label>
                                                        <input positive  type="number" class="col-md-7 col-sm-7 cls_input_inherit numberinput" min="0" ng-maxlength="3" id="age_min" name="age_min" ng-model="attributes.age_min"  required/>
                                                        <label for="age_min" ng-show="submittab2 && attributesForm2.age_min.$error.required" class="error">{{formValidation.required}}</label>                                                           
                                                        <label for="age_min" ng-show="submittab2 && !attributesForm2.age_min.$error.positive &&  attributesForm2.age_min.$error.maxlength" class="error"> {{formValidation.monthMaxChar}} </label>
                                                        <label for="age_min" ng-show="submittab2 && !attributesForm2.age_min.$error.positive && !attributesForm2.age_min.$error.maxlength && attributesForm2.age_min.$error.min" class="error">{{formValidation.minMax}}</label>
                                                        <label for="age_min" ng-show="submittab2 && !attributesForm2.age_min.$error.positive && !attributesForm2.age_min.$error.maxlength && attributesForm2.age_min.$error.number" class="error">{{formValidation.errorNumber}}</label>
                                                        <label for="age_min" ng-show="submittab2 && attributesForm2.age_min.$error.positive" class="error">{{formValidation.minpositive}}</label>
                                                    </div>

尝试上面的代码，但输入十进制值时没有显示错误？如何解决？

Answer 1

你需要添加ng-pattern =＆＃34; / ^（\ d）+ $ /＆＃34;在输入字段中。

 <div class="col-md-6 col-sm-6"> 
 <label class="col-md-5 col-sm-5 pad-top5 pad-lft-no">Min <span class="error">*</span></label>
                                                    <input positive  type="number" class="col-md-7 col-sm-7 cls_input_inherit numberinput" min="0" ng-maxlength="3" id="age_min" name="age_min" ng-model="attributes.age_min" ng-pattern="/^(\d)+$/" required/>
                                                    <label for="age_min" ng-show="submittab2 && attributesForm2.age_min.$error.required && attributesForm2.age_min.$touched && attributesForm2.age_min.$invalid"  class="error">{{formValidation.required}}</label>                                                           
                                                    <label for="age_min" ng-show="submittab2 && !attributesForm2.age_min.$error.positive &&  attributesForm2.age_min.$error.maxlength" class="error"> {{formValidation.monthMaxChar}} </label>
                                                    <label for="age_min" ng-show="submittab2 && !attributesForm2.age_min.$error.positive && !attributesForm2.age_min.$error.maxlength && attributesForm2.age_min.$error.min" class="error">{{formValidation.minMax}}</label>
                                                    <label for="age_min" ng-show="submittab2 && !attributesForm2.age_min.$error.positive && !attributesForm2.age_min.$error.maxlength && attributesForm2.age_min.$error.number" class="error">{{formValidation.errorNumber}}</label>
                                                    <label for="age_min" ng-show="submittab2 && attributesForm2.age_min.$error.positive" class="error">{{formValidation.minpositive}}</label>
                                                </div>

Answer 2

这只是替代答案，尝试使用指令

    Request.Cookies["userInfo"]["host"].ToString()
    Request.Cookies["userInfo"]["username"].ToString()
    Request.Cookies["userInfo"]["password"].ToString()

angular.module('myApp', []);

angular.module('myApp').directive('numOnly', numOnly);
  function numOnly(){
       var directive = {
            restrict: 'A',
            scope: {
                ngModel:'=ngModel'
            },
            link:link
        };

        return directive;

        function link(scope, element, attrs) {
            scope.$watch('ngModel', function (newVal, oldVal) {
                var arr = String(newVal).split('');
                if (arr.length === 0) return;
                if (arr.length === 1 && (arr[0] === '-' || arr[0] === '.')) return;
                if (isNaN(newVal)) {
                    scope.ngModel = oldVal;
                }
            });
        }
  }

angular.module('myApp').controller('myController', myController);
  myController.$inject = ['$scope'];
  function myController($scope){
    var vm = this;
    vm.txtNum = ''; // set default value as empty to avoid error in directive
    vm.txtNumTwo = ''; //set default value as empty to avoid error in directive

  }

如何只允许angularjs中的文本框中的数字？

2 个答案: