2016-04-23 134 views
0

我有两个输入一个最小值,另一个最大值。
如何添加验证以便最大限度地保留最小<?最小和最大验证

<div class="form-group"> 
 
    <label class="control-label"> Montant minimum</label> 
 
    <input id="min" class="form-control" type="number" ng-model="type.minMontant" required/> 
 
</div> 
 

 
<div class="form-group"> 
 
    <label class="control-label"> Montant maximum</label> 
 
    <input id="max" class="form-control" type="number" ng-model="type.maxMontant" required/> 
 
</div>

,然后当我会尽量挑一个值,它必须在[最小值,最大值]

回答

1

不知道这是笏你想

如果你想验证消息显示,那么你必须使用角度消息

<div ng-app> 
    <div class="form-group"> 
     <label class="control-label"> Montant minimum</label> 
     <input id="min" class="form-control" type="number" min="0" max="{{maxMontant}}" ng-model="minMontant" required/> 
    </div> 

    <div class="form-group"> 
     <label class="control-label"> Montant maximum</label> 
     <input id="max" class="form-control" type="number" max="10" ng-model="maxMontant" required/> 
    </div> 
</div> 
0

添加minmax attiribute(HTML5)

<div class="form-group"> 
    <label class="control-label"> Montant minimum</label> 
    <input id="min" class="form-control" type="number" ng-model="type.minMontant" min="0" required/> 
</div> 

<div class="form-group"> 
    <label class="control-label"> Montant maximum</label> 
    <input id="max" class="form-control" type="number" ng-model="type.maxMontant" max="10" required/> 
</div> 
0

您可以自定义验证检查的范围的完整性,然后检查可用范围的输入值。

下面是它的一个模拟:

JSFiddle

$scope.validate = function() { 
    var valid = $scope.validateMin() && $scope.validateMax(); 
    if (valid) { 
    if ($scope.type.value >= $scope.type.min && 
     $scope.type.value <= $scope.type.max) { 
     alert("Correct Value") 
    } else { 
     alert("Out of range"); 
    } 
    } else { 
    alert("Incorrent range values entered"); 
    } 
}