AngularJS1.X学习笔记7-过滤器】的更多相关文章

听说 明天是愚人节,这与我有什么关系呢!我可 不想被愚弄,但是但是,我这么笨怎么才能不被愚弄呢?左思右想,我决定从现在开始闭关,闭关干啥哩?学习!学习AngularJS.以前学习过Angular的,不过很久没用都忘的差不多了,所以决定好好复习一下.这两天我将多发几篇随笔,记录一下我的学习过程.参考用书<AngularJS高级程序设计-Adam Freeman>,我会参考书中的例子做一遍,谈谈自己的理解.现在按照作者的思路先总体把握一下,后面再一个一个看. 一.Module对象 调用angula…
转行学开发,代码100天——2018-05-23 今天学习angularJS的过滤器的使用. angular中的常用过滤器用来修改数据格式,主要有以下几类: 1.大写,| uppercase 2.小写,| lowercase 3.货币,| currency(美元) 4.排序,| orderBy:'marks' (按分数排序) 5.过滤器,| filter:subjectName angularJS使用案例: <!DOCTYPE html> <html> <head> &…
过滤器详细 1 过滤器的生命周期 我们已经学习过Servlet的生命周期,那么Filter的生命周期也就没有什么难度了! (l)  init(FilterConfig):在服务器启动时会创建Filter实例,并且每个类型的Filter只创建一个实例,从此不再创建!在创建完Filter实例后,会马上调用init()方法完成初始化工作,这个方法只会被执行一次: (l)  doFilter(ServletRequest req,ServletResponse res,FilterChain chain…
AngulaJS的指令是一种非常强大的特性,一个ng-repeat就能让我们非常方便的展示一个数据列表,指令相当于是一个组件,为我们将一些东西封装起来了,提供了复用的可能性.个人认为自定义指令还是比较复杂的,下面开始攻关. 一.三个重要参数 <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <meta charset="UTF-8"> &l…
最近参加笔试被虐成狗了,感觉自己的算法太弱了.但是还是先花点事件将这个AngularJS学习完.今天学习filter 一.内置过滤器 (1)过滤单个数据值 <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <meta charset="UTF-8"> <title>内置过滤器-过滤单个数据值</title> <…
  今天来讲javaweb的第9阶段学习.   过滤器,我在本次的思维导图中将过滤器和监听器放在一起总结了,监听器比较简单就不单独写了.   老规矩,首先先用一张思维导图来展现今天的博客内容.         ps:我的思维是用的xMind画的,如果你对我的思维导图感兴趣并且想看到你们跟详细的备注信息,请点击下载   另外:如果图看不清的话请右击---在新窗口中打开会清楚很多.             1* 作用:       用于过滤请求(Request)与响应(Response)的数据内容.…
分ip统计网站的访问次数 ip count 192.168.1.111 2 192.168.1.112 59 统计工作需要在所有资源之前都执行,那么就可以放到Filter中了. 我们这个过滤器不打算做拦截操作!因为我们只是用来做统计的. 用什么东西来装载统计的数据.Map<String,Integer> 整个网站只需要一个Map即可! Map什么时候创建(使用ServletContextListener,在服务器启动时完成创建,并只在到ServletContext中),Map保存到哪里!(Ma…
解决全站字符乱码(POST和GET中文编码问题) servlet: l  POST:request.setCharacterEncoding(“utf-8”); l  GET: String username = request.getParameter(“username”); username = new String(username.getBytes(“ISO-8859-1”), “utf-8”); 1 说明 乱码问题: l  获取请求参数中的乱码问题: POST请求:request.s…
过滤器详细 5 四种拦截方式 我们来做个测试,写一个过滤器,指定过滤的资源为b.jsp,然后我们在浏览器中直接访问b.jsp,你会发现过滤器执行了! 但是,当我们在a.jsp中request.getRequestDispathcer(“/b.jsp”).forward(request,response)时,就不会再执行过滤器了!也就是说,默认情况下,只能直接访问目标资源才会执行过滤器,而forward执行目标资源,不会执行过滤器!(跳转的不会执行F) public class MyFilter…
过滤器Filter Filter和Lister是Servlet规范里的两个高级特性.不同于Servlet,它们不用于处理客户端请求,只用于对request.response进行修改或者对context.session.request事件进行监听. Filter意为滤镜或者过滤器,用于Servlet之外对request或者response进行修改.Filter提出了滤镜链的概念,一个Filterchain包括多个F 1 什么是过滤器 过滤器JavaWeb三大组件之一,它与Servlet很相似!不它…
经过一番艰苦卓绝的鏖战,我终于来到了控制器和作用域部分.控制器作为MVC的C,其重要性不可谓不重要:作用域决定了你可以拿到哪些东西,亦是分外重要.现在就来学习一下两个东西.去看看$apply,$watch,$broadcast是个什么鬼. 一.谈谈MVC 阮一峰老师说Angular是一个叫MVVM的模式(http://www.ruanyifeng.com/blog/2015/02/mvcmvp_mvvm.html),而自由男人说这是一个MVC框架,个人认为都差不多,目标都是分层,便于协作和维护,…
大家愚人节快乐!表单是沟通服务器端和客户端的桥梁,为数据从客户端传到服务端打开了一扇大门.AngularJS增加了一些新特性,使我们能够更加方便的操作表单.OK!开始学习!学习使我快乐. 一.双向数据绑定 前面已经提到了双向数据绑定,一般而言我们总是从模型中拿到数据放到视图,双向数据绑定提供了这样一种机制,可以将视图中的数据放到模型.下面测试一下 <!DOCTYPE html> <html lang="en" ng-app='myApp'> <head&g…
AngularJS为我们定义了一系列事件指令,方便我们对用户的操作作出响应.甚至他还有一个可选模块提供了触摸事件和手势事件的支持,为移动端开发提供了可能.现在开始学习一下AngularJS的事件指令. 一.事件指令 先盗张图,这个图展示了AngularJS中定义的事件指令,下面来做一些测试. 指令 作用 描述 ng-blur 属性.类 对blur事件指定自定义行为,在元素失去焦点时被触发 ng-change 属性.类 对change事件指定自定义行为,在表单元素的内容状态发生变化 时被触发(例如…
前面学习了数据绑定指令,现在开始学习内置模板指令.看起来有点多,目测比较好理解.OK!开始! 一.ng-repeat 1.基本用法 <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <meta charset="UTF-8"> <title>databinding1</title> </head> <…
上一篇从整体上认识了Angular,从现在开始更加深入的学习Angular的特性.本次学习的是数据绑定.应该所有的MVC框架都会用到数据绑定,比如我所知道的ThinkPHP.struts等,只有实现了数据绑定才能将模型层和视图层分离,实现MVC.Angular的数据绑定比较特别,它支持双向数据绑定. 1.ng-bind <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> &…
过滤器Filter filter是对客户端访问资源的过滤,符合条件放行,不符合条件不放行,并且可以对目标资源访问前后进行逻辑处理. 步骤: 编写一个过滤器的类实现Filter接口 实现接口中尚未实现的方法(着重实现doFilter方法) 在web.xml中进行配置(主要是配置要对哪些资源进行过滤) 例子,过滤器实现类: package com.yyb.filter; import java.io.IOException; import javax.servlet.*; /** * Created…
本文主要涉及了ngAnimation和ngTouch模块,自由男人讲的比较少,估计要用的时候还要更加系统的学习一下. 一.安装 没错,就是酱紫. 二.玩玩动画 <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <meta charset="UTF-8"> <title>route test</title> <s…
说到Ajax,你一定是思绪万千,想到XMLHttpRequest,$.ajax(),跨域,异步之类的.本文将探讨一下AngularJS的Ajax. 一.一个简单的例子 <!DOCTYPE html> <html lang="en" ng-app='myApp'> <head> <meta charset="UTF-8"> <title>ajax1</title> </head> &l…
一.过滤器(Fliter)简介 过滤器是位于客户端与服务器之间的滤网,在访问资源时会经过一系列的过滤器, 满足条件则放行,不满足条件的将其拦截. 过滤器可以看做是一个特殊的Servlet,设置了过滤器及其过滤范围后, 访问处于过滤器过滤范围的资源,会先经过滤器,如果满足过滤条件就会被过滤器放行. 一系列过滤器的组合称为过滤链,但某一资源满处于多个过滤器的过滤范围时, 会执行完一个过滤器后进入下一个过滤器,执行顺序和web.xml中的过滤器的配置顺序有关. 过滤器不仅有过滤作用,在过滤过程中可以对…
位于过滤器顶端,第一个起作用的过滤器.SecurityContextPersistenceFilter 在执行其他过滤器之前,率先判断用户的session中是否已经存在一个SecurityContext了.如果存在,就把SecurityContext拿出来,放到SecurityContextHolder中,供Spring Security的其他部分使用.如果不存在,就创建一个SecurityContext出来,还是放到SecurityContextHolder中,供Spring Security…
信道过滤器主要职责是拦截不合规则的http请求,比如规定只能通过https访问资源,那么信道拦截器做相应的拦截处理,把http请求重定向为https请求,https请求则不做任何处理. 配置方式参照:http://www.cnblogs.com/mingluosunshan/p/5328830.html…
RBAC ->基于角色的权限控制 l  tb_user l  tb_role l  tb_userrole l  tb_menu(增.删.改.查) l  tb_rolemenu 1 说明 我们给出三个页面:index.jsp.user.jsp.admin.jsp. l  index.jsp:谁都可以访问,没有限制: l  user.jsp:只有登录用户才能访问: l  admin.jsp:只有管理员才能访问. 2 分析 设计User类:username.password.grade,其中grad…
作用:过滤response和request对象的内容 使用: Filter是J2EE的一个接口,自定义Filter需要实现该接口,并重写所有的方法. Filter提供的方法: init() doFilter() destory() 在web.xml中的配置: * 实现步骤: * 创建Java类,实现Filter接口,并且重写所有方法. * 在web.xml文件中进行配置. <filter> <filter-name>MyFilter1</filter-name> <…
最近在看算法分析,那个大O啊,小o啊,分治法啊(目前就看到这里),真是搞死了.这回呢休息一下,学学AngularJS动画,上一篇文章根据自由男人的书简单谈到了动画的话题,发现反响很大(好吧,我说慌了,那篇文章的动画谈得太简单了),今天来看看官方文档.嗯,边看边写. 一.安装 这个应该都知道了,和其他的扩展模块安装相同.这里为了文章完整性简单提一下.文档给到了获取动画扩展angular-animate.js的多种方式. 1.cdn,自己去查 2.npm install --save angular…
ThinkPHP框架有路由的概念,看起来路由更多的是后端的事情,Angular怎么也会跑出个路由呢?事实上,Angular是着眼于单页应用的,他的一个应用一般来说是一个页面,你所看到的页面内容的改变,事实上只改变了URL地址的#后面的内容.路由要解决的是hash值与视图的对应关系. 一.从一个简单的例子开始 1.安装angular-route模块 2.试一下子看看 <!DOCTYPE html> <html lang="en" ng-app="myApp&q…
如果我没记错的话,spring里边有个service层.什么是服务呢?个人理解就是很多地方要用的,可以跨越控制器甚至是跨越模块的工具.AngularJS也为我们提供了服务这种机制,这让我们可以将一些不属于某个控制器独有的东西定义成一个服务,要用的时候直接拿过来就好.使用服务有什么好处呢?一是便于统一修改,二是调用者不用关心内部实现,三是便于测试. 一.factory <!DOCTYPE html> <html lang="en" ng-app='myApp'>…
继续继续,学完这个部分就去吃饭.引用自由男人的话作为本文的开始:“默认情况下,链接函数被传入了控制器的作用域,而该控制器管理着的视图包含了指令所应用到的元素”.果然像是绕口令,还是看看你的例子比较好. 一.在一个控制器中应用同一指令 <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <meta charset="UTF-8"> <ti…
今天好大的雨啊!上一节中,我们的指令中的工厂函数中都是返回了一个叫做链接函数的工人函数,事实上我们的工厂函数也是可以返回一个对象,这个对象里面可以包含很多的属性,这使得我们可以创建更加强大的指令. 一.link属性 这个属性的值是一个函数,叫做链接函数. <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <meta charset="UTF-8"…
web.xml配置委托代理filter,filter-name默认与filter bean的名字保持一致. <filter> <filter-name>springSecurityFilterChain</filter-name> <filter-class>org.springframework.web.filter.DelegatingFilterProxy</filter-class> </filter> <filter-…