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にアタッチするだけです。

より高度なものが必要な場合は、「角度のある方法」で、必要な機能をラップしてボタンにアタッチするディレクティブを作成することをお勧めします（ディレクティブの実装方法によって異なります）。

例が必要な場合は、コメントで知らせてください

于 2013-03-09T00:51:21.133 に答える