angularJS(6)
angularJS(6)
一:angularJs的事件。
1.ng-click指令定义了AngularJS点击事件。


<div ng-app="myapp" ng-controller="myctrl">
<button ng-click="count=count+1">点赞</button>
<h1><span style="color:'red">♥</span>{{count}}</h1>
</div>
<script type="text/javascript">
angular.module('myapp',[]).controller('myctrl',function ($scope) {
$scope.count=0;
})
</script>


2.angularJs的事件方法


<div ng-app="mapp" ng-controller="mctrl">
<input type="button" ng-click="toggle()" value="显示/隐藏">
<div ng-show="hhh">
你的大名:<input type="text" ng-model="uname"><br>
你的称呼:<input type="text" ng-model="usex"><br>
<h1>{{uname+usex}}</h1>
</div>
</div>
<script language="javascript">
var app=angular.module("mapp",[]);
app.controller("mctrl",function($scope){
$scope.uname=“黄袍怪";
$scope.usex="妖";
$scope.hhh=true;
$scope.toggle=function(){
$scope.hhh= !$scope.hhh;
}
})
</script>


二:下面列一些angularJs常用的事件。
·ng-mousedown 鼠标按下
·ng-mouseup鼠标按下弹起
·ng-mouseenter鼠标进入
·ng-mouseleave鼠标离开
·ng-mousemove鼠标移动
·ng-mouseover鼠标进入
·ng-dblclick双击事件
·ng-blur 失去焦点事件
·ng-focus获取焦点
·ng-change更新model
·ng-copy 复制 ctrl+c
·ng-paste 粘贴 ctrl+v
·ng-keydown:键盘按下
三:angularJs过滤器。
AngularJS 过滤器可用于转换数据:
格式化数字为货币格式:currency
从数组项中选择一个子集:filter
格式化字符串为小写: lowercase
根据某个表达式排列数组:orderBy:’列名’
默认是从小到大排序,如果想从大到小排序,只需在列名前加 – 号
显示前几条: limitTo:3
如:<li ng-repeat=“x in student | orderBy:’uage’ | limitTo:3”>{{x.sname}}</li>
格式化字符串为大写:uppercase
实例:{{ uname | uppercase }}
四:angularJs服务(service)
AngularJS 中,服务是一个函数或对象,可在你的 AngularJS 应用中使用。AngularJS 内建了30 多个服务
$location 服务 。
$http 服务。
$timeout 服务。
$interval 服务。
创建自定义服务。
转
已关注
收藏该文
angularJS(6)的更多相关文章
- angularJS(5)
angularJS(5) 一,数据循环:特别要注意作用域 使用ng-repeat指令. <div ng-app="myApp" ng-controller="myC ...
- angularJS(4)
angularJS(4) 一:angulaJs的作用域scope Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带.scope 是一个 JavaScr ...
- angularJS(3)
angularJS(3) 一.angularJs的指令模型ng-model指令 ng-model 指令 绑定 HTML 元素 到应用程序数据. 为应用程序数据提供类型验证(number.email ...
- angularJS(2)
angularJS(2) 今天先讲一个angularJs的表单绑定实例: <div ng-app="myApp" ng-controller="formCtrl&q ...
- AngularJS(1)
AngularJS(1) 在讲正题之前,先说一下有关angular简介方面的信息: 1. angularJS 诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优 ...
- 学习笔记-AngularJs(十)
前面一直在说自定义指令,但是却一直没有一次系统地去了解,现在需要我们一起来学习如何去使用自定义指令,去丰富html标签.属性,实现多元化.多功能的标签(或是属性).辣么,啥是指令?要了解指令,首先需要 ...
- 学习笔记-AngularJs(九)
到目前为止,我们所做的学习案例都是没有加任何动画效果的,对于以往来说,我们经常会去使用一些动画插件或是css框架(如:animate.css)来点缀我们的网页,这样显得生动,高大上,那么接下来我们可以 ...
- 学习笔记-AngularJs(七)
在学习笔记-AngularJs(六)提及了事件处理器和过滤器以及它们的例子,而我们知道之前我是使用$http服务去获得我们需要的json数据,但是$http是比较底层的用法,有时候我们想把获取json ...
- 学习笔记-AngularJs(六)
在学习笔记-AngularJs(五),通过引入bootstrap.css进行改写整个样式,这时学习项目也变得好看多了,现在我们又需要目录再进行一次改变,如下图: 这样就符合之前讲的对学习目录进行布置了 ...
随机推荐
- Hangfire项目实践分享
Hangfire项目实践分享 目录 Hangfire项目实践分享 目录 什么是Hangfire Hangfire基础 基于队列的任务处理(Fire-and-forget jobs) 延迟任务执行(De ...
- EntityFramework Core Raw SQL
前言 本节我们来讲讲EF Core中的原始查询,目前在项目中对于简单的查询直接通过EF就可以解决,但是涉及到多表查询时为了一步到位就采用了原始查询的方式进行.下面我们一起来看看. EntityFram ...
- 一起学微软Power BI系列-使用技巧(4)Power BI中国版企业环境搭建和帐号问题
千呼万唤的Power BI中国版终于落地了,相信12月初的微软技术大会之后已经铺天盖地的新闻出现了,不错,Power BI中国版真的来了,但还有些遗憾,国际版的一些重量级服务如power bi emb ...
- C#与C++的发展历程第三 - C#5.0异步编程巅峰
系列文章目录 1. C#与C++的发展历程第一 - 由C#3.0起 2. C#与C++的发展历程第二 - C#4.0再接再厉 3. C#与C++的发展历程第三 - C#5.0异步编程的巅峰 C#5.0 ...
- “不给力啊,老湿!”:RSA加密与破解
作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 加密和解密是自古就有技术了.经常看到侦探电影的桥段,勇敢又机智的主角,拿着一长串毫 ...
- [APUE]系统数据文件与信息
一.口令文件 UNIX口令文件包含下表中的各个字段,这些字段包含在 由于历史原因,口令文件是/bin/passwd,而且是一个文本文件,每一行都包括了上表中的七个字段,字段之间用":&quo ...
- 玩转spring boot——AOP与表单验证
AOP在大多数的情况下的应用场景是:日志和验证.至于AOP的理论知识我就不做赘述.而AOP的通知类型有好几种,今天的例子我只选一个有代表意义的“环绕通知”来演示. 一.AOP入门 修改“pom.xml ...
- Velocity初探小结--velocity使用语法详解
做java开发的朋友一般对JSP是比较熟悉的,大部分人第一次学习开发View层都是使用JSP来进行页面渲染的,我们都知道JSP是可以嵌入java代码的,在远古时代,java程序员甚至在一个jsp页面上 ...
- 自己来实现一个简易的OCR
来做个简易的字符识别 ,既然是简易的 那么我们就不能用任何的第三方库 .啥谷歌的 tesseract-ocr, opencv 之类的 那些玩意是叼 至少图像处理 机器视觉这类课题对我这种高中没毕业的人 ...
- vue.js几行实现的简单的todo list
序:目前前端框架如:vue.react.angular,构建工具fis3.gulp.webpack等等...... 可谓是五花八门,层出不穷,眼花缭乱...其实吧只要你想玩还是可以玩玩的..下面是看了 ...