不要求

Question

驗證表單元素我有這樣的事情在這裏：

<div class="col-md-4"> 
    <input type="number" class="form-control" ng-model="apMin" placeholder="0"> 
</div> 
<div class="col-md-2 text-center">-</div> 
<div class="col-md-4"> 
    <input type="number" class="form-control" ng-model="apMax" placeholder="0" ng-required="apMin < apMax"> 
</div> 

我現在需要的是要確保，即apMin不超過apMax高。我試過類似的東西：

ng-required="apMin < apMax" 

該字段不需要被需要，但更重要的是工作的邏輯。有人知道如何去實現它嗎？

Answer 1

您可以嘗試在兩個變量上使用$ watch將該邏輯放入控制器中。

$scope.$watch("apMin", function(newVal, oldVal) { 
    if (newVal > $scope.apMax) { 
     alert("-Min cannot be greating then max"); 
     $scope.apMin = $scope.apMax - 1; 
    } 
    }); 

    $scope.$watch("apMax", function(newVal, oldVal) { 
    if (newVal < $scope.apMin) { 
     alert("+Min cannot be greating then max"); 
     $scope.apMax = $scope.apMin + 1; 
    } 
    }); 

看到這個Plunker

或者你可以嘗試只安裝在apMax文本框中NG-模糊和檢查，以確保apMax不小於apMin。

希望這會有所幫助。

Answer 2

您可以使用輸入的最小和最大屬性？

<input type="number" class="form-control" ng-model="apMin" placeholder="0" max="{{apMax-1}}"/> 

和

<input type="number" class="form-control" ng-model="apMax" placeholder="0" min="{{apMin+1}}"/> 

Answer 3

結賬此鏈接min/max directives

你可以使用它們喜歡：

<input type="number" ng-model="value1" ng-min="minValue" name="value1"/> 
<input type="number" ng-model="value2" ng-max="maxValue" name="value2"/>