本文实例讲述了AngularJS过滤器filter用法。分享给大家供大家参考，具体如下：这节我们来看看angularjs的过滤器filter。在我们开发中经常需要在页面显示给用户的信息需要一定处理格式化，才能显示给用户。比如时间本地化，或者yyyy-MM-dd HH:mm:ss格式，数字精度格式化，本地化，人名格式化等等。在angularjs中为我们提供了叫filter的指令，让我们能够很轻易就能做到着一些列的功能，angularjs内部为我们提供了number等很多内置的f...
本文实例讲述了AngularJS指令中的绑定策略。分享给大家供大家参考，具体如下：在前面的文章中，我们知道了指令如何生成独立的scope，这一节中我们来仔细研究一下scope中的绑定策略。总体来说scope的绑定策略分为3种：（1）@ : 绑定字符串（2）=： 与父控制器进行双向绑定（3）&：用于调用父scope中的函数1.基础方式<test word="{{wordCtrl}}"></test> app.controller(myController1,[$scope,function($scope){$scope.wordCtrl="h...
本文实例分析了AngularJS用户选择器指令。分享给大家供大家参考，具体如下：在开发表单时，我们需要使用经常需要使用到用户选择器，用户的数据一般使用如下方式存储：用户1,用户2,用户3我们可以使用angular指令实现选择器。<!DOCTYPE html> <html ng-app="app"> <head><meta charset="UTF-8"><meta http-equiv="content-type" content="text/html; charset=utf-8" /><script src="../assets/js/angular.min.js"></script><link rel...
本文实例讲述了Angularjs的Controller间通信机制。分享给大家供大家参考，具体如下：在Angularjs开发一些经验总结中提到我们需要按照业务区分angular controller，避免过大无所不能的上帝controller，我们把controller分离开了，但是有时候我们需要在controller中通信，一般为比较简单的通信机制，告诉同伴controller我的某个你所关心的东西改变了，怎么办？如果你是一个javascript程序员你会很自然的想到异步回调响应式通信—事件...
本文实例讲述了AngularJS中指令的四种基本形式。分享给大家供大家参考，具体如下：指令的四种基本形式中，注意注释型指令 M 的使用方法是 <!-- directive:指令名称 --> 注意左右俩测必须有空格才会正常识别所有指令是可以相互组合 的，不写restrict ，将会默认为A属性 指令要支持IE8 浏览器 一般最好将指令设置为属性<!doctype html> <html ng-app="myapp"><head><meta charset="utf-8"/></head><body><elementtag>E</elementtag...
本文实例讲述了AngularJS日期格式化常见操作。分享给大家供大家参考，具体如下： <!DOCTYPE html> <html ng-app="myApp"> <head lang="en"><meta charset="UTF-8"><title>www.gxlcms.com AngularJS日期格式化</title><script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script><style>.c1 {color: red;}</style> </head> <body ng-controller="myCtrl"> <!--格式 ： 年-月-日 星期 时:分:秒.毫秒 --> <d...
本文实例讲述了AngularJS中的作用域。分享给大家供大家参考，具体如下： 问题引入 使用 Angular 进行过一段时间的开发后，基本上都会遇到一个这样的坑： <div ng-controller="TestCtrl"><p>{{name}}</p><div ng-if="show"><input type="text" ng-model="name"></div> </div> <script> function TestCtrl($scope){$scope.show = true;$scope.name = htf; } </script>把 p 元素和 input 元素绑定同一个变量，你本以为，在输入框输入内...
本文实例讲述了Angular2管道Pipe及自定义管道格式数据用法。分享给大家供大家参考，具体如下： 管道(Pipe)可以根据开发者的意愿将数据格式化，还可以多个管道串联。 纯管道(Pure Pipe)与非纯管道(Impure Pipe) 管道分纯管道(Pure Pipe)和非纯管道(Impure Pipe)。默认情况下，管道都是纯的，在自定义管道声明时把pure标志置为false,就是非纯管道。如: @Pipe({name: sexReform,pure:false })纯管道和非纯管道的区别: ① 纯管道: Angu...
本文实例讲述了AngularJS中scope的绑定策略。分享给大家供大家参考，具体如下： 当scope选项写为scope:{ }这种形式的时候，就已经为指令生成了隔离作用域，指令的模板就无法访问外部作用域了： 具有隔离作用域的指令最主要的使用场景是创建可复用的组件，组件可以在未知上下文中使用，并且可以避免污染所处的外部作用域或不经意地污染内部作用域。 现在，我们来看看绑定策略的三种形式： @、= 、&。 1. @ 本地作用域属性：使用@符号...
本文实例讲述了AngularJS ng-repeat指令及Ajax的应用。分享给大家供大家参考，具体如下： ng-repeat 指令用于循环输出指定次数的 HTML 元素。集合必须是数组或对象。 定义： <element ng-repeat="expression"></element>说明：experssion表达式定义了如何循环集合。常用的如：x in records 下面通过一个例子,来说明ng-repeat如何绘制一个表格： <div ng-app=mainApp ng-controller=studentController><table border="0"><tr><td>姓...
本文实例讲述了AngularJS中ng-class用法。分享给大家供大家参考，具体如下： 使用 ng-class 动态设置元素的类，方法是绑定一个代表所有需要添加的类的表达式。重复的类不会添加。当表达式发生变化，先前添加的类会被移除，新类会被添加。 在angular中为我们提供了3种方案： ① 通过数据的双向绑定（不推荐使用） ② 通过对象数组。 ③ 通过key/value 一、通过数据双向绑定： function changeClass(){$scope.className = "change2";...
本文实例分析了AngularJS的依赖注入。分享给大家供大家参考，具体如下： 依赖注入（DI）的好处不再赘言，使用过spring框架的都知道。AngularJS作为前台js框架，也提供了对DI的支持，这是JavaScript/jQuery不具备的特性。angularjs中与DI相关有angular.module()、angular.injector()、 $injector、$provide。对于一个DI容器来说，必须具备3个要素：服务的注册、依赖关系的声明、对象的获取。比如spring中，服务的注册是通过xml配置文...
本文实例讲述了AngularJS路由机制ngRoute。分享给大家供大家参考，具体如下： 引言 在我们介绍路由之前我们首先谈一下SPA，所以SPA就是我们现在经常说的单页应用single page APP，为了实现无刷新的视图切换我们之前的做法就是利用AJAX从后取出数据然后渲染在前台页面HTML中，但是AJAX有一个致命的缺点就是不能实现浏览器的后退按钮失效，为了解决这个问题我们通常使用hash，监听hashchange事件来进行视图切换，另一个方法是用HTML5...
本文实例讲述了AngularJS的MVC架构。分享给大家供大家参考，具体如下： MVC应用程序架构最早于1970年起源于Smalltalk语言，后来在桌面应用程序开发中使用较为广泛，如今在WEB开发中也非常流行。MVC的核心思想是將数据的管理（Model）、业务逻辑控制（Controller）和数据的展示（View）分离开来，使程序的逻辑性和可维护性更强。 对于AngularJS应用来说，视图（View）是DOM（文档对象模型），你可以理解为就是HTML页面。控制器（Con...