概述
ember-list-filter 是一个适用于 Ember.js 的过滤器组件，它可以让你在视图中实现基于输入框的实时搜索和统计。
安装
使用 npm 进行安装：
npm install ember-list-filter
使用
在需要使用组件的地方引入它：
import ListFilter from 'ember-list-filter/components/list-filter';
然后就可以在模板中使用它了：
-- -------------------- ---- -------
-----------
-------------------
---------------------
--------------- ------ -------
---------------
-- ------------------
----
------- --------------- -- ----------
------------------- ---------------------
---------
-----
-------------使用 @data 属性传入需要过滤的数据源，@fields 属性传入需要搜索的字段，@minInput 属性传入最小搜索字符数，as |filteredResults| 可以将过滤后的结果传入模板中进行渲染。
示例代码
以下是一个使用 ember-list-filter 进行实时搜索和统计的例子：
-- -------------------- ---- -------
----- -------------------------------------- ----
-----------
--------------------
---------------------
--------------- ------ -------
---------------
-- ------------------
----- --- ------- ---------------- ----
----------- ----------------- -------- --- ------- ---------------- -- ----- ----------
----
------- --------------- -- ----------
------------------- ---------------------
---------
-----
--------
----- ----- ----------
-------
--------------- -------------------- ---- -------
-- ---------------------------
------ --------- ---- ---------------------
------ ------- ----- ----------------- ------- --------- -
----- - -
- ----- -------- ---- -- --
- ----- ------- ---- -- --
- ----- --------- ---- -- --
- ----- --------- ---- -- --
- ----- -------- ---- -- --
- ----- ------ ---- -- --
- ----- ------ ---- -- --
--
-总结
ember-list-filter 是一个非常实用的组件，它可以让你在 Ember.js 中实现非常简单的实时搜索和统计功能。本篇文章介绍了 ember-list-filter 的安装和使用方法，并提供了一个具体的示例代码。希望能对你在实际开发中使用 ember-list-filter 有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066e1ba563576b7b1ecc21