Erlaube eine Dezimalstelle in angularjs

Question

Dies ist eine kurze Version meines Codes.

<div> 
    <input type="number" name="content" md-auto-focus 
    ng-model="vm.model.content" 
    ng-required="{{vm.required === null ? true : vm.required}}" 
    ng-attr-ng-max="{{vm.max}}" ng-attr-ng-min="{{vm.min}}"> 
    <div ng-message-exp="['required','min']" ng-if="vm.min != null"> 
    <span data-translate translate-value-length="{{vm.min}}">min</span> 
    </div> 
    <div ng-message="required" ng-if="vm.min == null"> 
    <span data-translate>required</span> 
    </div> 
    <div ng-message="number"> 
    <span data-translate>numberOnly</span> 
    </div> 
    <div ng-message="max"> 
    <span data-translate translate-value-length="{{vm.max}}">max</span> 
    </div> 
</div> 

wie Sie hier sehen können,

https://regex101.com/r/fvPBTW/1 ich gleiche Regex verwenden.

Er akzeptiert 44,44, 44,

aber nicht 44, 44.444,44.44.44, 44.44.

Ich denke, wegen der Nummer-Funktion.

Aber ich möchte nur die Zahl und eine Dezimalzahl mit der Nummer danach eingegeben werden.

so änderte ich Nummer

<input type="text" name="content" md-auto-focus 

in Text, aber diesmal geht es String und Dezimalzahlen nicht speichern.

Answer 1

Die kurze Version Ihres Codes ist nicht genug, um Ihnen zu helfen. Ich konnte in der Vergangenheit tun, was du willst. Unten ist der Weg, wie ich es erreicht habe.

var app = angular.module('jmApp', []); 
 

 
    app.controller('MainCtrl', function($scope) { 
 
    }); 
 

 
    app.directive('validNumber', function() { 
 
     return { 
 
     require: '?ngModel', 
 
     link: function(scope, element, attrs, ngModelCtrl) { 
 
      if(!ngModelCtrl) { 
 
      return; 
 
      } 
 

 
      ngModelCtrl.$parsers.push(function(val) { 
 
      if (angular.isUndefined(val)) { 
 
       var val = ''; 
 
      } 
 
      
 
      var clean = val.replace(/[^-0-9\.]/g, ''); 
 
      var negativeCheck = clean.split('-'); 
 
\t \t \t var decimalCheck = clean.split('.'); 
 
      if(!angular.isUndefined(negativeCheck[1])) { 
 
       negativeCheck[1] = negativeCheck[1].slice(0, negativeCheck[1].length); 
 
       clean =negativeCheck[0] + '-' + negativeCheck[1]; 
 
       if(negativeCheck[0].length > 0) { 
 
       \t clean =negativeCheck[0]; 
 
       } 
 
       
 
      } 
 
       
 
      if(!angular.isUndefined(decimalCheck[1])) { 
 
       decimalCheck[1] = decimalCheck[1].slice(0,1); 
 
       clean =decimalCheck[0] + '.' + decimalCheck[1]; 
 
      } 
 

 
      if (val !== clean) { 
 
       ngModelCtrl.$setViewValue(clean); 
 
       ngModelCtrl.$render(); 
 
      } 
 
      return clean; 
 
      }); 
 

 
      element.bind('keypress', function(event) { 
 
      if(event.keyCode === 32) { 
 
       event.preventDefault(); 
 
      } 
 
      }); 
 
     } 
 
     }; 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="jmApp"> 
 
    <h2>Validate Price</h2> 
 
    <div ng-controller="MainCtrl"> 
 

 
     <input type="text" ng-model="salary" valid-number /> 
 
    </div> 
 
</div>