Angular textarea指令:允许数字,不允许逗号,点数?

时间:2015-05-22 08:06:23

标签: javascript angularjs angular-directive

我有一个textarea,它将多个值存储在ng-model中作为数组。按下输入并插入新的有效字符(数字和点),将在数组中创建一个新值。

enter image description here

我正在尝试调整我在答案中找到的自定义指令。但我仍然有以下问题:

1-您仍然可以输入连续点作为(34 ... 5),这是不允许的。
2-如果按两次相同的键,则接受该键直到按下新键。因此,如果我按两次字符“d”,它将在textarea中呈现。
3-如果被按下,我也希望指令将昏迷转换成点。
4-一个新值必须以数字而不是点开始和结束。
5-每个数组值只有一个点。

这是我的代码:

查看/模板:

<script type="text/ng-template" id="form_field_float">
  <textarea only-digits class="form-control" rows="{{dbo.attributes[attobj.name].length + 2}}" ng-model="dbo.attributes[attobj.name]" ng-list="&#10;" ng-trim="false" ng-change="dbo._isDirty = true"></textarea>
</script>

指令:

 app.directive('onlyDigits', function () {

      return {
          restrict: 'A',
          require: '?ngModel',
          link: function (scope, element, attrs, ngModel) {
              if (!ngModel) return;
              ngModel.$parsers.unshift(function (inputValue) {

                  var digits = inputValue.split('').filter(function (s) { return (!isNaN(s) && s != ' ' || s == "."); }).join('');
                  console.log(inputValue);
                  ngModel.$viewValue = digits;
                  ngModel.$render();
                  return digits;
              });
          }
      };
  });

1 个答案:

答案 0 :(得分:0)

在replace()中指令中的正则表达式最终是解决方案:

模板:

<script type="text/ng-template" id="form_field_float">
  <textarea only-flo class="form-control" rows="{{dbo.attributes[attobj.name].length + 2}}" ng-model="dbo.attributes[attobj.name]" ng-list="&#10;" ng-trim="false" ng-change="dbo._isDirty = true"></textarea>
</script>

指令:

  app.directive('onlyFlo', function () {

      return {
          restrict: 'A',
          require: '?ngModel',
          link: function (scope, element, attrs, ngModel) {
              if (!ngModel) return;
              ngModel.$parsers.unshift(function (inputValue) {

                  //var digits = inputValue.split('').filter(function (s) { return (!isNaN(s) && s != ' ' || s == '.'); }).join('');
                  var digits=  inputValue.replace(/\.{2,}/g, '.').replace(/e{2,}/gmi, 'e').replace(/[^0-9\.\n\r\-e]/gmi, '');
                  //var digits=  inputValue.split(/\s/).filter(function(s){return isNaN(s) ? false : s}).join('\r');
                  console.log('dig: ' +digits);
                  console.log(inputValue);

                  ngModel.$viewValue = digits;
                  ngModel.$render();
                  return digits;
              });
          }
      };
  });
相关问题