Angular UI Bootstrap - 未選擇Typeahead下拉值時清除模型值？

我想弄清楚如何有一個UI.Bootstrap Typeahead（http://angular-ui.github.io/bootstrap/）只設置模型的值，如果從下拉列表中選擇，並清除該字段，如果沒有做出選擇。Angular UI Bootstrap - 未選擇Typeahead下拉值時清除模型值？

如果有一個不同的控制，那麼這也可以工作。

Typeahead選擇一個對象，如果用戶只輸入幾個字符然後離開該字段，則將該模型值設置爲該字段的字符串值。我明顯可以測試這種情況，但修改範圍模型值不會刷新表單有效性。所以如果我有一個必填字段，我也必須將字段的有效性設置爲false。

這一切看起來像很多工作，有人必須已經想通了。有什麼建議麼？

編輯

另一個我想過，是不是到從事先鍵入的內容正被提交到服務器的範圍分隔值的最佳做法？

來源

2014-12-02 Josh Russo

我有一個類似的問題。我繞過它的方式是使用blur事件進行驗證。

<input type="text" ng-model="yourModel" ng-blur="validateSelection() 
    typeahead="item for item in list | filter:$viewValue"">

來源

2014-12-11 18:25:50 GGhe

這就是我最終解決這個問題的方法。雖然我還沒有更新過，因爲我正在爲控制本身開發更全面的拉取請求。使這個功能成爲一個可配置的選項 – 2014-12-11 19:18:08

@JoshRusso你如何用鼠標處理選擇？模糊事件發生在選擇事件之前和模型值更改之前？ – hansmaad 2016-06-29 07:52:24

@hansmaad我很高興你問，這是一個很好的觀點。你需要使用一些'SetTimeout（）'技巧。 'validateSelection（）'函數的主體需要被包裝在一個'SetTimeout（）'調用中並捕獲超時ID。在菜單的單擊事件中，您可以使用'clearTimeout（）'取消超時調用。因爲這是觸發模糊的單擊事件，所以您甚至不需要設置延遲值。超時工作的方式實質上只是將驗證主體移動到這一系列調用中調用的最後一個東西。 – 2016-06-30 00:11:50

Angular UI Bootstrap - 未選擇Typeahead下拉值時清除模型值？

回答

相關問題