検索機能のカスタマイズ

Dec 26 2020

これは、その列を持つテーブルを示しています。必要なのは、デフォルトのフィルター関数の代わりに検索ルックアップ関数を作成することです。これにより、テーブル全体ではなく、[ミニフィルターウィンドウの値のリスト]がオンになります。[![ここに画像の説明を入力] [1]] [1]

氏名Michaelを入力すると、テーブルはMichaelによってフィルタリングされます。または、電話番号を入力すると、Michaelの名前がMichaelによってフィルタリングされます。言い換えると。

フィルタの値をフィルタベースのトークンに変更する必要はありません。また、列の値を列ベースのトークンに変更したくないのですが、検索フィールドへのユーザーの入力がトークン内にある場合にのみ必要です。トークンのキーを返し、ユーザーに表示します。

回答

1 rateLess Dec 28 2020 at 18:31

ここで実用的な例を取得しました。私はAngularにあまり詳しくないので、コードが奇妙に見えるかもしれないことに注意してください。

と呼ばれるカスタムフィルターを定義しました。このフィルターではCustomSetFilter、テキスト入力tokensがで定義されてfilterDataいる各チェックボックスの検索フィールドとして機能します。入力が空の場合、すべてのチェックボックスが表示されます。そうでない場合は、入力の値に等しいトークンを持つチェックボックスのみが表示されます(大文字と小文字は区別されません)。これはonChange()関数で見ることができます。