彈出窗口中的輸入字段以及彈出窗口視圖的驗證

Question

我正在創建Cordova Ionic應用程序。如何在彈出窗口中的輸入字段上應用驗證。我有兩個字段：寬度和高度。我想對這兩個字段應用驗證。

驗證將是：

最小值爲10mm
最大價值：千毫米

而且我不知道爲什麼彈出的看法是像（以下Android平板給定的圖像）這。輸入字段未顯示。鍵盤打開時按鈕不見了。

當鍵盤沒有打開：

當鍵盤開啓：

Answer 1

如果我理解正確的話，你想爲一個最大值和最小值設置輸入字段。

<input name="width" type="number" min="10" max="1000"> 

還可以使用Angular's ngChange directive檢測輸入變化時和從去低於10或高於1000不允許該用戶，這裏是一個（不完全的）例如：：可以通過執行以下操作與HTML實現這一

控制器

$scope.input = { 
    width: 10, 
    height: 10 
}; 

$scope.inputChanged = function(input) { 
    if(input >= 10 && input <= 1000) { 
    // This is valid input and should be left untouched. 
    } else if(input < 10) { 
    // If it is lower, set it to 10. 
    } else if(input > 1000) { 
    // If it is higher, set it to 1000. 
    } 
}; 

查看

<input name="height" type="number" min="10" max="1000" ng-model="input.height" ng-change="inputChanged(input.height)"> 
<input name="width" type="number" min="10" max="1000" ng-model="input.width" ng-change="inputChanged(input.width)"> 

上面的例子是故意不完整的，只是因爲我不認爲有必要使用JavaScript時，HTML應該取決於你在找什麼就夠了。此外，您還可以在用戶提交值並顯示錯誤時驗證輸入。