Angularjs 事件指令
1. 点击事件
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="angular.min.js"></script>
</head>
<body>
<div ng-app="myApp"> <div ng-controller="firstController">
<div ng-click="run()">点击</div>
</div>
</div>
<script type="text/javascript">
var app = angular.module("myApp", []);
app.controller('firstController',function($scope){
$scope.text='phonegap中文网'; $scope.run=function(){ alert('run');
console.log('run');
}
});
</script> </body>
</html>
2. 样式 ng-class
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="angular.min.js"></script>
<style>
.red{background:red;}
.yellow{background:yellow;}
</style>
</head>
<body>
<div ng-app="myApp"> <div ng-controller="firstController">
<div ng-click="run()">点击</div>
<div ng-class="{red:true}">{{text}}</div>
</div>
</div>
<script type="text/javascript">
var app = angular.module("myApp", []);
app.controller('firstController',function($scope){
$scope.text='phonegap中文网'; $scope.run=function(){ alert('run');
console.log('run');
}
});
</script> </body>
</html>
Angularjs 事件指令的更多相关文章
- AngularJs ng-change事件/指令(转)
from:http://blog.csdn.net/u011127019/article/details/52564111 定义和用法 ng-change 指令用于告诉 AngularJS 在 HTM ...
- AngularJS 事件
AngularJS 有自己的 HTML 事件指令. ng-click指令: ng-click 指令定义了 AngularJS 点击事件. <!DOCTYPE html> <html& ...
- 带你走近AngularJS - 体验指令实例
带你走近AngularJS系列: 带你走近AngularJS - 基本功能介绍 带你走近AngularJS - 体验指令实例 带你走近AngularJS - 创建自定义指令 ------------- ...
- 《AngularJS》--指令的相互调用
转载自http://blog.csdn.net/zhoukun1008/article/details/51296692 人们喜欢AngularJS,因为他很有特色,其中他的指令和双向数据绑定很吸引着 ...
- 学习AngularJs:Directive指令用法（完整版）
这篇文章主要学习AngularJs:Directive指令用法,内容很全面,感兴趣的小伙伴们可以参考一下 本教程使用AngularJs版本:1.5.3 AngularJs GitHub: http ...
- AngularJS1.X学习笔记4-内置事件指令及其他
AngularJS为我们定义了一系列事件指令,方便我们对用户的操作作出响应.甚至他还有一个可选模块提供了触摸事件和手势事件的支持,为移动端开发提供了可能.现在开始学习一下AngularJS的事件指令. ...
- AngularJS学习之旅—AngularJS 事件(十四)
1.AngularJS 事件 ng-click ( 适用标签 :所有,触发事件:单击): ng-dblclick( 适用标签 :所有,触发事件:双击): ng-blur(适用标签 : a,input, ...
- AngularJs HTML DOM、AngularJS 事件以及模块的学习（5）
今天的基础就到了操作DOM,事件和模块的学习,其实我个人感觉学习起来AngularJS并没有想象中的那么的艰难,可能是因为这个太基础化吧,但是我们从初学开始就应该更加的自信一些,后来我可能会写一个小的 ...
- AngularJs:Directive指令用法
摘自:http://www.jb51.net/article/83051.htm 摘要:Directive(指令)是AngularJ非常强大而有有用的功能之一.它就相当于为我们写了公共的自定义DOM元 ...
随机推荐
- django - html
1.注释 单行注释: {# #} 多行注释: {%comment%} {%endcomment%} 2.访问元组 不用t[0],要用t.0. 例: {% for t in text %} {{t.0 ...
- NOIP初赛 BLESS ALL！
祝初赛顺利!RP++! 下午再写一篇题解来加RP
- cas AssertionThreadLocalFilter
AssertionThreadLocalFilter AssertionThreadLocalFilter作用很简单,就是将Assertion绑定到ThreadLocal. ThreadLocal 无 ...
- 树状数组Lowbit用法
刚学树状数组,看到这里的时候懵了.经过询问,发现,原来在程序运行时,数据用的都是补码,于是解决了 int Lowbit(x) { return x&(-x); } 如: x =1: 1 &am ...
- jQuery一句话实现多选框全选/取消
<!DOCTYPE Html> <html> <head> <script type="text/javascript" src=&quo ...
- AndroidStudio的transformDexArchiveWithExternalLibsDexMergerForDebug报错解决方案
错误排查记录. 今天在gradle更新了一个引入包的版本号,然后引发了下面的血案. 报错信息: org.gradle.api.tasks.TaskExecutionException: Executi ...
- AVG Internet Security 2013 – 免费1年
AVG 是一款来自捷克的老牌的且非常优秀的免费杀毒软件,自推出以来就颇受用户好评!一直以来诸多的优点使其获得不少忠实用户,即便在中国也赢得了不少粉丝!AVG的安全产品广泛地被欧美以及大洋洲地区使用,并 ...
- eclipse集成svn后总是弹出 Password Required问题解决方法
最近在集成svn后,在打开eclipse后总是一遍遍的弹出 Password Required,即使输入正确的用户名以及密码也会弹出,最后发现是eclipse的Network Connections ...
- Kali Liunx 2.0震撼来袭（附下载地址、新特性和更新日志）
Kali 2.0昨天已经在BlackHat 2015 USA上正式发布了.无论是粉丝们还是Kali官方都对这个2.0版本抱有极大的期待和热情.这是第一个基于Debian Jessie的Kali版本,此 ...
- Home Kit框架简介
重要:本文是针对开发过程中使用的API或者技术的初步文档.苹果提供该文档旨在为开发者使用该技术和苹果产品上的编程接口提供帮助.这些信息可能会发生变化,依据该文档开发的软件应该使用最新的操作系统软件和最 ...