私のアプリケーションには、この動作のフォームがあります。フォーム フィールドの値は、入力がフォーカスを失うか、ユーザーが Enter キーを押すと、サーバーに段階的にアップロードされます。これは、lost-focus (カスタム ディレクティブ) および key-press ( ng-keydown
) イベントにフックすることによって行われます。同時に、Angular-ui Bootstrap Typeahead コントロールを都市検索 (およびその他のフィールド) に使用しています。入力は次のようになります。
<input type="text" name="city"
ng-model="dispatcher.city"
ng-keydown="dispatcher.inputKeyPress($event)"
typeahead="obj.city as obj.city for obj in lookup('city', $viewValue)">
先行入力なしの入力は正常に機能しますが、都市の入力に関しては、次のように機能します。
- ユーザーは都市の入力を開始します (Lon など)。
- タイプアヘッドは、提案を含むポップアップを表示します
- ユーザーは London を選択し、Enter キーを押します
- 先行入力によって入力が London で埋められますが、その直後に、入力値がサーバーに送信される値である Lon a に変更されます。
keypress イベントは 2 つのアクションをもたらすと思います: typeahed はその方法で処理し、同時にng-keydown
それをその方法で解釈します。タイプアヘッドがイベントを「消費」し、それを「さらに進め」ないようにするか、ng-keydown
コールバックがタイプアヘッドの提案が表示されているかどうかを知る必要があるようです(特定のイベントを「スキップ」できるように)。
で遊んでみましたが、これら 2 つのコールバック (と) を何とかtypeahead-on-select="onSelect($item, $model, $label)"
同期できませんでした。キーを押す方が早く実行されるようです。inputKeyPress
onSelect
これらのいずれかを達成する方法について何か提案はありますか? それとも完全に別のものですか?
ありがとう
これに加えて、Typeahead は素晴らしいコントロールです。