7

使用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>
4

2 回答 2

30

我有同样的问题。也许简单是最好的?

无需在控制器中调用方法。也不需要指令。只是一个简短的声明来清除您在输入标签中声明的模型。像这样:

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

当输入中没有文本时,您也可以隐藏清除按钮,如下所示:

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

顺便说一句,也许将清除按钮放在输入框内的指令会很好。就像你在 iPhone 上看到的那样。

于 2014-02-01T14:41:23.993 回答
8

ng-click是“角”的方式来做到这一点

只需在您的范围内声明一个函数并将其附加到按钮的 ng-click

如果您想要更高级的东西,那么“Angular 方式”建议创建一个指令来包装您想要的功能并将其以某种方式附加到您的按钮(取决于您如何实现指令)

如果你想要一个例子,请在评论中告诉我

于 2013-03-09T00:51:21.133 回答