AngularJS當模型爲原始時的自定義驗證

如何創建驗證集表單。當初始值無效（模型爲原始）時，$ valid爲false。如果我手動更改輸入，則表單。$ valid將根據輸入進行更正。AngularJS當模型爲原始時的自定義驗證

http://plnkr.co/edit/lDrsCFez8PkROuEC6wvC?p=preview （這是根據從自定義驗證部分https://docs.angularjs.org/guide/forms整數指令。）

2014-07-01 jostyposty

在你的指令，你只指定一個$parser。
當$viewValue改變時，即通過與視圖交互（或以編程方式設置$viewValue），$parser生效。

但是你沒有觸及$viewValue，只有$modelValue。
如果要在$modelValue更改時執行驗證，則還需要指定$formatter。

例如，添加以下代碼在你的鏈接功能：

ctrl.$formatters.push(function (modelValue) { 
    if (modelValue && !INTEGER_REGEXP.test(modelValue)) { 
     ctrl.$setValidity('integer', false); 
    } else { 
     ctrl.$setValidity('integer', true); 
    } 
    // Return the original value regardless of its validity, 
    // so it shows up in the view (even if it is invalid). 
    return modelValue; 
});

還參見本short demo。

更新：

我更新上述代碼和演示時$modelValue被編程改變爲考慮到空值的情況下，也適當地重新驗證。

來源

2014-07-01 19:30:34 gkalpak

謝謝！並感謝您花時間來解釋！ – jostyposty

你能否解釋爲什麼我需要（或應該）不用真正的regexp.test來調用$ setValidity？ – jostyposty

@jostyposty：我無法解釋:)你的問題讓我意識到你應該和你也應該考慮空值（通常驗證不應該應用於空值）。看看我更新的演示（和答案）。 – gkalpak

你爲什麼不使用type =「號」

<input type="number" ng-model="size" name="size" />

來源

2014-07-01 19:16:51

我不喜歡某些瀏覽器在使用數字時在輸入內部創建東西的方式。像上下箭頭一樣。另外，在我創建的float指令中，我需要用戶能夠編寫1,2個不是有效的數字。我想我喜歡保持一致。 – jostyposty

AngularJS當模型爲原始時的自定義驗證

回答

相關問題