AngularJS，使用按鈕清除輸入文本

使用AngularJS，清除文本字段值的正確方法是什麼？我有一個旁邊有一個按鈕的輸入欄。用戶輸入並點擊按鈕清除或重置。AngularJS，使用按鈕清除輸入文本

我知道我可以在按鈕本身上添加一個ng-click事件並調用一個函數，但我不確定這是否正確。

現在我只有：

<input type="text" ng-model="searchQuery" /> 
<button class="btn" <!--do something here maybe?-->> 
    <i class="icon-search" ng-class="{'icon-refresh': searchQuery.length}"></i> 
</button>

來源

2013-03-09 Ronnie

ng-click是「角」的方式做到這一點

只需要聲明一個函數在你的範圍並將其連接到按鈕的NG單擊

如果你想要更先進的東西，那麼「角度的方式」建議創建一個指令來包裝你想要的功能並以某種方式將它附加到你的按鈕上（取決於你如何實現如果你想要一個例子EMENT你的指令）

，讓我知道在評論

來源

2013-03-09 00:51:21 Dogoku

好的，如果是這樣，那麼我很確定我能弄明白。我不確定是否有更好的做法可以做到這一點。謝謝@Dogoku – Ronnie 2013-03-09 00:56:51

，只是爲了確認，這是我最終重置它''scope.resetSearch = function（）{$ scope.searchQuery =「」;}' – Ronnie 2013-03-09 01:00:40

是的，看起來不錯 – Dogoku 2013-03-09 01:01:43

我有同樣的問題。也許簡單是最好的？

無需調用控制器中的方法。不需要任何指令。只是一個簡短的聲明來清除您在輸入標籤中聲明的模型。就像這樣：

<input ng-model="searchQuery"> 
<button class="btn" ng-click="searchQuery = ''"></button>

您也可以隱藏在清除按鈕時，有輸入任何文字，如：

<button class="btn" ng-show="searchQuery.length" ...></button>

順便說一句，也許指令，會把清除按鈕內的輸入框會很好。就像你在iPhone上看到的一樣。

來源

2014-02-01 14:41:23 nijlgier

+1 - 這是更多的'角度的方式'只是爲了清除點擊數據模型。 – Zeeshan 2014-03-05 08:16:41

很棒的回答。只是爲了澄清一個小的錯字 - 仔細檢查「searchQquery」按鈕。 – Federico 2014-04-17 18:35:24

謝謝，我刪除了第二個'q' – nijlgier 2014-04-19 09:05:27

AngularJS，使用按鈕清除輸入文本

回答

相關問題