angularJs中筛选功能-angular.filter-1

以下介绍为自己在使用angular-filter时,简单总结的用法。

开始

1.你可以使用4中不同的方法来安装angular-filter:

克隆或创建这个存储库

通过bower:通过在你的终端执行:$ bower install angular-filte

通过npm:通过在你的终端执行:$ npm install angular-filte

通过cdnjs: http://www.cdnjs.com/libraries/angular-filte

2.在包含或Angular本身外,在引用angular-filter.js(或者angular-filter.min.js)在你的项目index.html中;

3.添加‘angular.filter’依赖项;

当你做完这些,你的文件看起来就类似以下:

<!doctype html>

... ... filter 从数组中选取一个子集,并将其返回成一个新的数组;

用法:

// html中:{{ collection | filter : expression : comparator}}

// js中:$filter(‘filter’)(array, expression, comparator)

参数:array:想筛选的数组

expression:用于从数组中筛选的条件

comparator:用于确定预期值(从筛选器表达式)和实际值(从数组中的对象)中使用的比较器,应视为匹配。

$scope.friends = [

{name:‘John’, phone:‘555-1276’},

{name:‘Mary’, phone:‘800-BIG-MARY’},

{name:‘Mike’, phone:‘555-4321’}

]

{{friendObj.name}} {{friendObj.phone}}

<–result

John 555-1276

–>

Date

https://docs.angularjs.org/api/ng/filter/date

将日期筛选为想要的日期格式;

用法:

// html中:{{ collection | date : format : timezone}}

// js中:$filter(‘date’)(date, format, timezone)

参数:format为设置的日期格式,例如:‘yyyy-MM-dd’

timezone被用于格式化时区。

{{1288323623006 | date:‘yyyy-MM-dd HH:mm:ss Z’}}

<–result:

2010-10-29 11:40:23 +0800

–>

Collection

concat

将另外一个对象或者数组拼接到已有的对象或者数组之后;

基本思路如下:

1)使用JQ的.getJSON()读取JSON文件,将读取的数据使用 .getJSON() 读取JSON文件,将读取的数据使用.getJSON()读取JSON文件,将读取的数据使用.each() 进行循环遍历,同时在循环体中在 里面插入option 值为当前遍历的值。

2)市级随省级变化而变化,我的做法是,重新再读取一次JSON文件,使用onchange()来监测 选项的变化。

3)通过KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲province option….(each) 循环遍历中进行匹配,如果匹配成功,则取出JSON数据中的“城市”对象,再进行一遍$.(each) 遍历,同时组装html代码块(或者直接使用append()进行插入,但这样的话就必须在函数的开始就清空对应的html内容)。

4)使用.html() 将上面组装好的html代码块插入到html文档中。

5)区级随市级变化而变化,参考第2,3,4步。

我的博客即将同步至腾讯云+社区,邀请大家一同入驻:https://cloud.tencent.com/developer/support-plan?invite_code=1loab4y69jfje

---------------------

作者:w4979

来源:CSDN

原文:https://blog.csdn.net/w4979/article/details/84579937

版权声明:本文为博主原创文章,转载请附上博文链接!

原文链接:https://blog.csdn.net/w4979/article/details/84579937

编辑于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏前端杂货铺

Angular源码分析之$compile

@(Angular) $compile,在Angular中即“编译”服务,它涉及到Angular应用的“编译”和“链接”两个阶段,根据从DOM树遍历Angula...

3545
来自专栏coding...

swift3.0 基础练习-实现99乘法表

753
来自专栏Java架构师历程

JVM加载class文件的原理

当Java编译器编译好.class文件之后,我们需要使用JVM来运行这个class文件。那么最开始的工作就是要把字节码从磁盘输入到内存中,这个过程我们叫做【加载...

5272
来自专栏日常分享

Java 访问权限控制 小结

总所周知,Java提供了访问权限修饰词,以供类库开发人员向客户端程序员指明哪些是可用的,哪些是不可用的。

2471
来自专栏我是攻城师

理解Java里面的代理模式

代理模式是23种设计模式中非常经典的一种模式,在日常生活中到处充满了代理模式的痕迹,常见的比如火车代售点买票,各种公共服务大厅,以及各种网上购物平台其实都可以看...

4361
来自专栏Java帮帮-微信公众号-技术文章全总结

第二十四天 多线程-多线程&线程安全【悟空教程】

进程:进程指正在运行的程序。确切的来说,当一个程序进入内存运行,即变成一个进程,进程是处于运行过程中的程序,并且具有一定独立功能。

1305
来自专栏芋道源码1024

Java初中级面试题(2)

5967
来自专栏决胜机器学习

PHP实用功能——modern PHP读书笔记(一)

PHP实用功能——modern PHP读书笔记 (原创内容,转载请注明来源,谢谢) 一、命名空间 1、命名空间按照虚拟的层次结构组织PHP代码,类似操作系统的目...

4515
来自专栏Python小屋

Python编程常见出错信息及原因分析(1)

1.被0除错误 演示代码: >>> 2 / 0 Traceback (most recent call last): File "<pyshell#0>",...

3056
来自专栏大闲人柴毛毛

Java并发编程的艺术(二)——重排序

当我们写一个单线程程序时,总以为计算机会一行行地运行代码,然而事实并非如此。 什么是重排序? 重排序指的是编译器、处理器在不改变程序执行结果的前提下,重新排列指...

38410

扫码关注云+社区

领取腾讯云代金券