AngularJS - 當我使用ngModelOptions allowInvalid = true時需要手動做什麼？

Question

我是AngularJS的新手，我現在正在研究一個非常複雜的表單，看起來我可以通過使用ngModelOptions { allowInvalid: true }選項獲益。

我覺得AngularJS的默認行爲是爲了在無效視圖值無效時吹走模型值。我的第一個猜測是確保在用戶提交數據時無效值不會傳遞到服務器。

所以我想我的問題是

• 將使用此選項時我失去了什麼角度的功能？
• 我假設每次用戶嘗試提交數據時都需要手動檢查這些值的有效性。有沒有我應該考慮使用的Angular便利方法來檢查這些數據並顯示錯誤消息？
• 還有什麼我錯過了，我需要考慮使用此選項時？

Answer 1

除了防止在模型上設置無效值，您不會失去任何角度特徵。

模型控件仍然被標記爲無效，只是它不是將值設置爲undefined，而是允許在模型上設置無效值。

使用此標誌時需要注意的一件事是任何正在觀察模型值的東西。由於通常無效字段在設置標誌後不會觸發$ watch事件，因此可能會將錯誤值傳遞給其他指令或函數。

Answer 2

如果您想對無效值執行某些操作，AllowInvalid可能很有用。一個很好的例子是創建一個密碼強度顯示指令。如果你不允許在7個字符以下的密碼，你不會知道用戶正在打字，直到到達第8個字符，因此你將無法提供反饋。

使用AllowInvalid不會將該字段標記爲有效，因此您仍然可以使用form.password。$ invalid來顯示錯誤消息。

在提交之前，您可以在傳遞數據之前檢查字段或更通用的表單是否有效。