`

angularJS 搜索框

阅读更多
1、页面
<div class="search-box">
    <form name="searchForm" novalidate ng-keyup="applyGlobalSearch()">
        <button class="btn" type="submit" ng-disabled="searchForm.$invalid"><i class="fa fa-search"></i></button>
        <input type="text" class="form-control" autocomplete="off" maxlength="128" name="searchTerm" ng-model="globalSearchTerm" placeholder="搜索" />
     </form>
</div>

2、js
self.applyGlobalSearch = function(){
    var term = self.globalSearchTerm;
    self.volumesTable.filter({$:term});
  };
分享到:
评论

相关推荐

    Angularjs material 实现搜索框功能

    angular-material 是 AngularJS 的一个子项目,用来提供实现了 Material Design 风格的组件。 Material 提供了大量的android 风格的UI组件,使用 angularjs + Material 可以很容易开发出风格接近原生 Android 5.x 的...

    angularjs自定义select搜索查找插件

    angularjs自定义select组件,自定义option选项,并支持搜索查找功能。

    AngularJS Admin Dashboard Theme

    AngularJS 1.3.x Bootstrap界面 AngularUI 6个不同的主题皮肤 无限的风格SASS 4层侧边栏菜单 100%充分响应 完全可定制的 可用文档 CSS3页面转换 加载栏 固定和默认标题布局 固定和默认页脚布局 固定和默认...

    Angularjs实现带查找筛选功能的select下拉框示例代码

    主要介绍了Angularjs实现带查找筛选功能的select下拉框的详细过程及示例代码,文中通过示例介绍的很详细,相信会对大家学习使用Angularjs具有一定的参考借鉴价值,有需要的朋友们可以一起来看看。

    angularjs 实现带查找筛选功能的select下拉框实例

    本篇文章主要介绍了angularjs 实现带查找筛选功能的select下拉框实例,具有一定的参考价值,感兴趣的小伙伴们可以参考一下。

    ng-datalist:AngularJS指令提供带有可搜索下拉列表的文本输入

    ngDatalist AngularJS指令可为文本输入提供可搜索的下拉列表。现场演示特征一文件指令,易于与模块打包器(如webpack,gulp等)集成。 可搜索的下拉列表。 选择打开/关闭表格中的“需要”。 易于应用自定义样式。...

    Angularjs实现搜索关键字高亮显示效果

    需求分析: 根据关键字搜索网页内容,并且高亮显示内容中的关键字 细节分析:  1、每次执行搜索操作,需清空上一次结果 ...代码思路: 利用正则表达式匹配关键字 使用javascript字符串替换的方式...angularjs^1.2.9 $sco

    基于SSM框架+solr搜索框架实现的校园二手交易平台源码+数据库

    平台开发使用的技术有: 后台:spirng,springmvc,mybaits, 前台:angularjs+bootstrap。 权限控制:shiro 搜索引擎:solr 分布式搜索引擎。 数据库:MySQL 开发环境与工具:IDEA+MAVEN 业务管理员:admin/123456 ...

    angucomplete, AngularJS自动完成指令.zip

    angucomplete, AngularJS自动完成指令 angucomplete一个简单但功能强大的AngularJS指令,允许你快速创建从服务器或者局部变量提取数据的自动完成框。要查看演示文稿,请执行以下操作: ...

    整理AngularJS框架使用过程当中的一些性能优化要点

    1. 简介 无论你正在编写一个旧的应用程序还是在一个...一个简单的例子就是线性搜索和二分检索有着非常显著的性能差距。 第二个软件缓慢的原因被称为空间复杂度。这是一台电脑需要多少“空间”或内存运行你的应用程序。

    angularJs-$http实现百度搜索时的动态下拉框示例

    下面小编就为大家分享一篇angularJs-$http实现百度搜索时的动态下拉框示例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

    AngularJS控制器继承自另一控制器

    比如说有多个类似的页面,都有面包屑,搜索栏,工具栏,表格等元素,面包屑表格这种元素考虑做成directive,那么必然会有许多类似的配置需要从controller传到组件里去,也会产生很多工具类方法用于处理数据等,这...

    Node.js MongoDB AngularJSWeb开发中文版.part1

    注意: Node.js MongoDB AngularJSWeb开发((中文版))pdf 由于文件比较大,次分为三部分上传,下载好三部分之后,放在同一个文件夹下,进行解压即可,另外两部分地址为: part2:...

    Social-Network-AngularJS:SoftUni 的 JS 框架与 AngularJS 课程的课程项目

    评论显示框 显示喜欢/不喜欢按钮和逻辑 用户悬停时弹出 用户墙 展示用户墙 带有提交按钮的邮箱 显示好友 删除帖子和评论 帖子 添加帖子 编辑帖子 删除帖子 喜欢/不喜欢帖子 注释 添加评论 编辑评论 ...

    Angular实现搜索框及价格上下限功能

    闲来无事,写一个简单的angular的搜索框。 1.要求: 利用 AngularJS 框架实现手机产品搜索功能,题目要求: 1)自行查找素材,按照原有数据格式将手机产品数据丰富到至少10个以上 2)自行设计页面,需要包含“搜索...

    Library-Management-System-using-AngularJS:关于图书馆管理服务的AngularJS项目

    该项目基于一个名为AngularJSJavaScript框架,并实现了Angular软件包中包含的大多数关键功能。怎么跑克隆存储库在浏览器中打开main.html 以学生或图书管理员身份登录作为一个学生 - 查看所有书籍或根据空房情况根据...

    angular-search:使用angularjs和Bing API的演示应用程序

    #Angular搜索应用 这是一个用于AngularJS的简单演示应用程序。 该应用程序涵盖了Angular应用程序的多个方面,例如组织和构建过程。 ##使用的技术 (框架) (测试中) (构建) (构建过程) (代码质量) ...

Global site tag (gtag.js) - Google Analytics