AngularJS
文章平均质量分 72
wea111222333
hello world
展开
-
AngularJS(七)迭代3
转载出处:http://www.cnblogs.com/liulangmao/p/3716522.html 每个迭代项中还有以下三个变量: $first: 判断是否是迭代第一项,如果是,得到true,如果不是,得到false $middle: 判断是否迭代中间项(既不是第一项也不是最后一项的都是中间项),如果是,得到true,如果不是,得到false $last转载 2017-08-11 10:05:02 · 165 阅读 · 0 评论 -
AngularJS(一)Demo
转载出处:http://www.cnblogs.com/liulangmao/p/3700919.html 入门实例: 一个购物车产品清单,可以自行改变数量,总价自动计算的小例子: 代码如下: DOCTYPE html> html ng-app> head> title>1.1实例:购物车title> meta charset="u转载 2017-08-11 09:48:03 · 474 阅读 · 0 评论 -
AngularJS(二)创建模块
转载出处:http://www.cnblogs.com/liulangmao/p/3711047.html 如果在页面的html标签(或任意标签)中添加ng-app,表示对整个页面应用angular来管理. 他是一个模块. 模块有助于把东西从全局命名空间中隔离. 今天学习如何自定义创建模块: DOCTYPE html> html> head> title转载 2017-08-11 09:49:27 · 554 阅读 · 0 评论 -
AngularJS(三)视图绑定数据的两种方式
转载出处:http://www.cnblogs.com/liulangmao/p/3711463.html 绑定数据有两种方式: DOCTYPE html> html ng-app> head> title>2.2显示文本title> meta charset="utf-8"> script src="../angular.js">script> script转载 2017-08-11 09:50:39 · 217 阅读 · 0 评论 -
AngualrJS(四)input元素的ng-model属性
转载出处:http://www.cnblogs.com/liulangmao/p/3713758.html input元素的ng-model属性: 用于将input的值和变量的值进行双向绑定 DOCTYPE html> html ng-app> head> title>2.3.1input数据绑定title> meta charset="utf-8"> scrip转载 2017-08-11 09:51:49 · 1461 阅读 · 0 评论 -
AngularJS(五)阶乘实例1
转载出处:http://www.cnblogs.com/liulangmao/p/3714209.html DOCTYPE html> html ng-app> head> title>2.3.2计算阶乘实例1title> meta charset="utf-8"> script src="../angular.js">script> script src="转载 2017-08-11 09:53:49 · 244 阅读 · 0 评论 -
AngularJS(五)阶乘实例2
转载出处:http://www.cnblogs.com/liulangmao/p/3714319.html DOCTYPE html> html ng-app> head> title>2.3.3计算阶乘实例2title> meta charset="utf-8"> script src="../angular.js">script> script src="转载 2017-08-11 09:55:14 · 150 阅读 · 0 评论 -
AngularJS(五)阶乘实例3
转载出处:http://www.cnblogs.com/liulangmao/p/3715547.html 同样是上一个例子,我们要求并非实时的计算结果,而是等到用户确定自己已经输入完毕,然后进行计算: DOCTYPE html> html ng-app> head> title>2.3.4计算阶乘实例3title> meta charset="utf-8">转载 2017-08-11 09:56:00 · 177 阅读 · 0 评论 -
AngularJS(六)非侵入式javascript
转载出处:http://www.cnblogs.com/liulangmao/p/3716181.html 这篇主要讲解非入侵式javascript. 在传统的前端开发中,把js写在html中,称为入侵式的javascript: span id="select_area" onclick="..." > 这种做法由于没有把视图和行为分离,而且不易于维护管理,转载 2017-08-11 09:57:10 · 328 阅读 · 0 评论 -
AngularJS(七)迭代1
转载出处:http://www.cnblogs.com/liulangmao/p/3716307.html 本篇介绍angular中元素的迭代: DOCTYPE html> html ng-app> head> title>4.1.迭代title> meta charset="utf-8"> script src="../angular.js">script转载 2017-08-11 09:58:15 · 302 阅读 · 0 评论 -
AngualrJS(十四)$watch 2
转载地址:http://www.cnblogs.com/liulangmao/p/3723385.html 下面来看一个$watch的比较复杂的例子: 还是回到http://www.cnblogs.com/liulangmao/p/3700919.html一开始讲的购物车例子, 给它添加一个计算总价和折扣的功能,如果总价超过500,则优惠10%: 代码如转载 2017-08-18 11:14:29 · 216 阅读 · 0 评论 -
AngualrJS(八)控制视图显示隐藏
转载地址:http://www.cnblogs.com/liulangmao/p/3716600.html 本篇介绍angular控制视图的显示和隐藏: 通过给元素添加ng-show属性或者ng-hide属性来控制视图的显示或隐藏: ng-show: 绑定的数据值为true时,显示元素,值为false时,隐藏元素 ng-hide: 绑定的数据值为true时,隐藏转载 2017-08-18 11:05:09 · 375 阅读 · 0 评论 -
Angular(九)css类和样式1
转载地址:http://www.cnblogs.com/liulangmao/p/3718968.html 本篇主要介绍通过数据绑定来给元素添加特定的类名,从而应用特定的样式 从一个最基本的例子来看: DOCTYPE html> html ng-app> head> title>6.1css类和样式title> meta charset="utf-8">转载 2017-08-18 11:06:18 · 413 阅读 · 1 评论 -
AngualrJS(九)css类和样式2
转载地址:http://www.cnblogs.com/liulangmao/p/3719085.html 在上一个例子中,元素的类名使用拼接的方法,这样,类名中就不得不带有true或false,并且不易维护,所以,angular使用ng-class属性来控制元素的类名: 我们来看一个小例子,点击error按钮,顶部提示错误框,点击warning按钮,顶部提示警告框.转载 2017-08-18 11:06:56 · 195 阅读 · 0 评论 -
AngualrJS(九)css类和样式3
转载地址:http://www.cnblogs.com/liulangmao/p/3719130.html 再来看一个选择li列表的例子: 点击li中的任意项,被点击的li高亮显示: DOCTYPE html> html ng-app> head> title>6.3css类和样式title> meta charset="utf-8"> script转载 2017-08-18 11:07:41 · 170 阅读 · 0 评论 -
AngularJS(十)src和href处理
转载地址:http://www.cnblogs.com/liulangmao/p/3719162.html 本篇主要介绍angular中图片的src和链接的href的处理: 用到了以下两个属性: ng-src: 绑定了数据的路径表达式 ng-href: 绑定了数据的路径表达式 例如: DOCTYPE html> html ng-app> hea转载 2017-08-18 11:09:15 · 1010 阅读 · 0 评论 -
AngularJS(十一)表达式
转载地址:http://www.cnblogs.com/liulangmao/p/3720214.html 本篇只要介绍angular表达式: 在之前的例子中,我们多半是直接把数据作为angular标识符的值,但其实可以使用表达式来做更多的事情: 比如: {{number}} 也可以是: {{number+10}} (将数据进行简单的运算) 也可以转载 2017-08-18 11:10:05 · 408 阅读 · 0 评论 -
AngularJS(十二)控制器
转载地址:http://www.cnblogs.com/liulangmao/p/3720271.html 本篇主要介绍控制器: 控制器在前面的例子中已经大量的用到,它的作用主要是: 控制某块视图,通过$scope向这块视图提供数据,函数,并且监视需要被检测的部分,当发生变化时,做出相应的动作,从而起到控制该部分视图的作用 为了保持控制器的最小化和可管理,应该为转载 2017-08-18 11:10:48 · 222 阅读 · 0 评论 -
AngualrJS(十三)改变$scope的值
转载地址:http://www.cnblogs.com/liulangmao/p/3720363.html 本篇主要介绍控制器的$scope中的数据是如何被改变的: 以下三种方法,都可以改变$scope中的number值: 1. 表达式: 点击改变值1 2. 回调函数: 点击改变值2 $scope.computeNum = function()转载 2017-08-18 11:12:23 · 698 阅读 · 0 评论 -
AngualrJS(十四)$watch 1
转载地址:http://www.cnblogs.com/liulangmao/p/3722885.html 本篇主要介绍$watch的基本概念: $watch是所有控制器的$scope中内置的方法: $scope.$watch(watchObj,watchCallback,ifDeep) watchObj: 需要被检测的对象,可以是以下任意一种:转载 2017-08-18 11:13:50 · 275 阅读 · 0 评论 -
AngularJS(七)迭代2
转载出处:http://www.cnblogs.com/liulangmao/p/3716457.html 视图的迭代和它的ng-repeat属性绑定的数据是实时绑定的,一旦数据发生了改变,视图也会立即更新迭代. 还是刚才的那个例子,给它添加一个添加数据按钮和一个删除数据按钮. DOCTYPE html> html ng-app> head> title>4.转载 2017-08-11 09:59:36 · 231 阅读 · 0 评论