2016-11-22 11 views
0

私のアプリでは、オンラインWebサービスからユーザーのリストを取り出し、fetchedUsersの配列に格納します。私はAngular 2でモデル駆動型を使用しています。私は、ユーザーから入力を受け取る入力テキストフィールドを持っています。テキストフィールドからの入力を受け取り、一致したデータのみを表示する作業用検索パイプがあります。 hereと同じ検索機能を実装しようとしています。私はng2-selectのようないくつかの角度の2つのプラグインを介してこの動作を取得しようとしましたが、運はありません。私は検索することができる選択要素を望んでいません。私は一致したデータを検索して表示できる入力フィールドが必要です。
角2配列で検索して項目を選択

はすでに完了:

をこれまでのところ、私は一致したデータを検索し、表示することができます。例えばaと入力すると、入力フィールドの下に結果が表示されます。

達成しよう:

私は上下キーやキーボードを使用して結果をナビゲートするユーザープレスは、私はその項目がselectedUsersと表示内容の配列に追加したい項目のキーを入力すると、以下のselectedUsers

どうすればこの問題を解決できますか?ご理解のため、上記のリンクをご覧ください。

私は私のアプリhereとコードの作業のデモを持っているが(keyup.enter)を使用して入力し、選択された値を取得する上で関数を呼び出すgithub

+0

申し訳ありませんが、あなたのデモが正常に動作しない、現れてユーザがいない... – foch

+1

だから、あなたは右、一般に「オートコンプリート」として知られている機能をしたいですか?たとえば、https://www.npmjs.com/package/ng2-auto-completeとplunker http://plnkr.co/edit/3pB1Gx?p=previewのようにチェックしましたか? –

+0

@PetrAdamありがとうございました。私はこのプラグインとその動作をテストしました。 – usmanwalana

答えて

0

上で閲覧することができます。

<option #val (keyup.enter)="myFunction(val)"></option> 
関連する問題