ionic 2 起航 控件的使用 客户列表场景(三)
我们来看看客户列表的搜索控件是怎么工作的吧。
1.打开customer.html
<ion-content>
<ion-searchbar
[(ngModel)]="searchQuery"
(input)="getItems($event)"
placeholder="客户名称或客户曾用名"></ion-searchbar>
2.ion-searchbar 就是我们的主角。下面有三个属性
[(ngModel)]="searchQuery" ,angular 2的一个双向绑定,跟后台customerPage类的的searchQuery对应着
(input)="getItems($event)" (input)是一个事件,就是输入的时候触发后台一个getItems()的方法。$event事件的参数
placeholder="客户名称或客户曾用名",这里就是高大上的水印文字啦。
ok,我们再看看后台customer.ts做了什么?
1.searchQuer:string='' ,这里是CustomerPage的一个属性。:string 类型是string型的
2.getItems(searchbar),这里是一个方法,每当输入的时候便会触发
3. this.items = this.items.filter((v) => {
if (v.toLowerCase().indexOf(q.toLowerCase()) > -1) {
return true;
}
return false;
})
这里就是触发后,进行搜索过来items的列表。
下一章,我会继续介绍列表的刷新事件和下拉加速数据事件,欢迎持续关注
ionic 2 起航 控件的使用 客户列表场景(三)的更多相关文章
- ionic 2 起航 控件的使用 客户列表场景(四)
接下来,我们的客户列表要怎么刷新数据呢? 我们不会安卓开发,不会ios开发,没关系,我们还有ionic 2.ionic 2的控件 Ion-refresher 轻松帮我们搞掂. <!--下拉刷新- ...
- ionic 2 起航 控件的使用 客户列表场景(二)
首先放出我hithub项目代码例子,有兴趣研究探讨的同学可以去看看 https://github.com/linyuebin2016/ionic2.git 下面我们来尝试下第一个项目场景 一份客户的列 ...
- 常用控件产品官方文档/手册/API列表 c#控件文档API列表 asp.net控件产品技术文档中文版
.netCHARTING报表图表控件 文档帮助手册Ab3d.PowerToys 文档帮助手册Ab3d.Reader3ds 文档帮助手册ABViewer 文档帮助手册 (工程图纸文档管理系统)Activ ...
- DevExpress控件使用经验总结- GridView列表行号显示操作
DevExpress是一个比较有名的界面控件套件,提供了一系列的界面控件套件的DotNet界面控件.本文主要介绍我在使用DevExpress控件过程中,遇到或者发现的一些问题解决方案,或者也可以所示一 ...
- [iOS基础控件 - 4.2] APP列表 字典转模型Model
A.使用字典加载数据的缺点 1.用户自行指定key,容易出错 2.存入.取出都需要key,容易混乱 B.模型 (MVC中的model) 1.字典与模型对比: (1)字典:存储数据,通过字符串类型的 ...
- WP8.1开发中ListView控件加载图列表的简单使用(1)
我也是刚接触WP编程没几个月,就是在这段时间一直闲着没事,然后又比较喜欢WP这款系统,就学习了WP这方面的开发言语,自学是很困难的,掌握这方面的资料不多,很初级,就是自己在网上找资料学习过程中,看到别 ...
- DS控件库 Win7链接列表框的仿Windows开始菜单样式
Win7链接列表框是依照Windows7的开始菜单开发的,同时进行了属性和功能的扩展. 效果图 项属性 控件属性 控件主要事件 点击项(Sender As Win7链接列表框, Itm As 链接项, ...
- DS控件库 Win7链接列表框效果1:右侧箭头
Win7链接列表框是仿Windos7开始菜单项开发的控件,同样支持右侧箭头,由于使用场合的不同,本控件中右键箭头不作为菜单扩展,而是通过事件触发式响应. 先上图 代码很简单,点击对右侧箭头区域点击的响 ...
- C# WinfForm 控件之dev报表 XtraReport(三) 动态数据绑定
代码还用上一节的,把reportFrx的dataSource去掉.各cell绑定的字段也去掉,有了第二节的基础,现在看这个ms就不难了 无非就是 传到reportFrx一个数据集 在把这个数据集 绑到 ...
随机推荐
- 阶段2-新手上路\项目-移动物体监控系统\Sprint1-声音报警子系统开发\第1节-Sprint Backlog规划
根据之前的sprint1-声音报警子系统是相对比较大的一个需求,需要把它进一步细化,然后指定sprint Backlog product Backlog是整个产品的功能列表! sprint Backl ...
- Session和cookie有什么区别?
cookie是保存在客户端的信息,它只能保存String类型的,没有session安全,如果客户端禁用了cookie就不能够使用了 Cookie是客户端技术,程序把每个用户的数据以cookie的形式写 ...
- hortonworks docker 安装
1. 下载并解压安装脚本: Hortonworks Data Platform (HDP) for Docker 2. 进入到解压后的目录,运行下面的命令,{HDPversion} 需要替换成相应目 ...
- Spring MVC 基于URL的映射规则(注解版)
好几天没有跟进Spring MVC的学习了,之前看了点源码都忘的差不多了.这次就跟着之前的问题,继续总结下Spring MVC中的小知识. 关于SpringMVC的小demo可以参考这里! url-p ...
- PureComponent
前言 React15.3中新加了一个 PureComponent 类,PureComponent 也就是纯组件,取代其前身 PureRenderMixin , PureComponent 是优化 Re ...
- 学习:数学----gcd及扩展gcd
gcd及扩展gcd可以用来求两个数的最大公因数,扩展gcd甚至可以用来求一次不定方程ax+by=c的解 辗转相除法与gcd 假设有两个数a与b,现在要求a与b的最大公因数,我们可以设 a=b*q+ ...
- jmeter如何设置全局变量以及调用方法
当遇到如跨线程组调用变量等情况,需要设置全局变量. 1.打开函数助手 输入需要的值然后点击生成按钮,或者直接使用${__setProperty(newuserid,${userid},)}的格式 设置 ...
- Luogu P4159 [SCOI2009]迷路 矩阵快速幂+精巧转化
大致就是矩阵快速幂吧.. 这个时候会发现这些边权$\le 9$,然后瞬间想到上回一道题:是不是可以建一堆转移矩阵再建一个$lcm(1,2,3,4,5,6,7,8,9)$的矩阵?...后来发现十分的慢q ...
- spark shell start
spark-shell \--master yarn \--deploy-mode client \--queue default \--driver-memory 1G \--executor-me ...
- vbox安装64位ubuntu
如果不做任何设置的话,你会发现下载下来的vbox只能安装32位的系统,如果想要安装64位的系统,我们需要做一些配置: 进入bios(basic input output system), Securi ...