ng-blur 　　　　　　描述：规定blur 事件的行为
　　　　　　实例：当输入框失去焦点的(onblur)时执行表达式：
　　　　　　　　<input ng-blur="count = count + 1" ng-init="count=0"/>
　　　　　　　　<h1>{{count}}</h1>
　　　　　　定义和用法
　　　　　　　　　　ng-blur 指令用于告诉AngularJS HTML 元素在失去焦点时须执行的表达式。
　　　　　　　　　　语法：<element ng-blur="expression"></element>
　　　　　　　　　　参数值：值：expression 描述：失去焦点时执行的表达式。

ng-change 　　　　描述：规定在内容改变时执行的表达式。
　　　　　　实例：当输入框 的值改变时执行函数。
　　　　　　　　<body ng-app="myApp">
　　　　　　　　　　<div ng-controller="myCtrl">
　　　　　　　　　　　　<input type="text" ng-change="myFunc()" ng-model="myvalue">
　　　　　　　　　　　　<p>The input field has changed {{count}} times.</p>
　　　　　　　　　　</div>
　　　　　　　　</body>
　　　　　　　　<script>
　　　　　　　　　　　　angular.module('myApp',[])
　　　　　　　　　　　　.controller('myCtrl',['$scope',function($scope){
　　　　　　　　　　　　$scope.count =0;
　　　　　　　　　　　　$scope.myFunc = function(){
　　　　　　　　　　　　　　　　$scope.count++;
　　　　　　　　　　　　　　}
　　　　　　　　　　　　}])
　　　　　　</script>
　　　　定义和用法
　　　　　　　　ng-change 指令用于告诉AngularJS 在HTML元素值改变时需要执行的操作。
　　　　　　　　ng-change 指令需要搭配ng-model 指令使用。
　　　　　　　　AngularJS ng-change 指令指令不会覆盖原生的 onchange 事件, 如果触发该事件，ng-change 表达式与原生的 onchange 事件都会执行。
　　　　　　　　ng-change 事件在值的每次改变时触发，它不需要等等一个完成的修改过程或等待失去焦点的动作
　　　　　　　　ng-change 事件只针对输入框值的真实修改，而不是通过JavaScript 来修改。
　　　　　　　　语法：<element ng-change="expression"></element>
　　　　　　　　参数值： 值:expression 描述：元素值改变时执行表达式。

ng-checked 　　　　规定元素是否被选中
　　　　　　　　实例：选择一个或选择所有选项：
　　　　　　　　　　<body ng-app="">
　　　　　　　　　　　　<p>My:</p>
　　　　　　　　　　　　<input type="checkbox" ng-model="all">
　　　　　　　　　　　　<input type="checkbox" ng-checked="all">
　　　　　　　　　　　　<input type="checkbox" ng-checked="all">
　　　　　　　　　　　　<input type="checkbox" ng-checked="all">
　　　　　　　　　　</body>
　　　　　　　　定义和用法
　　　　　　　　　　　　ng-checked 指令用于设置复选框（checkbox）或单选按钮(radio)的checked 的属性。
　　　　　　　　　　　　如果ng-checked 属性返回true ,复选框（checkbox） 或单选按钮（radio）将会被选中。
　　　　　　　　语法：
　　　　　　　　　　　　<input type="checkbox | radio" ng-checked="expression">
　　　　　　　　　　　　参数值： 值：expression 描述; 如果返回true ，将会选中元素选项。

ng-class 　　　　　　描述:指定HTML 元素使用的CSS 类。
　　　　　　　　实例：修改<div>元素的类：
　　　　　　　　　　　　<select ng-model="home">
　　　　　　　　　　　　<option value="sky">Sky</option>
　　　　　　　　　　　　<option value="tomato">Tomato</option>
　　　　　　　　　　　　</select>
　　　　　　　　　　　　<div ng-class="home">
　　　　　　　　　　　　　　<h1>Welcome Home !</h1>
　　　　　　　　　　　　　　<p>I like it !</p>
　　　　　　　　　　　　</div>
　　　　　　　　定义和用法
　　　　　　　　　　　　ng-class 指令用于给HTML 元素动态绑定一个或多个CSS 类。
　　　　　　　　　　　　ng-class 指令的值可以是字符串，对象，或一个数组。
　　　　　　　　　　　　如果是字符串，多个类名使用空格分隔。
　　　　　　　　　　　　如果是对象，需要使用 key-value 对，key 是一个布尔值，value 为你想要添加的类名。只有在 key 为 true 时类才会被添加。
　　　　　　　　　　　　如果是数组，可以由字符串或对象组合组成，数组的元素可以是字符串或对象。
　　　　　　　　　　　　语法：<element> ng-class="expression"</element>
　　　　　　　　　　　　参数值： 值：expression 描述： 表达式返回一个或多个类名。

ng-class-even 　　　　　　描述：类似ng-class,但只在偶数行起作用。
　　　　　　　　实例：为表格的偶数行设置 class="striped":
　　　　　　　　　　<table>
　　　　　　　　　　　　<tr ng-repeat="x in records" ng-class-even="'striped'" >
　　　　　　　　　　　　<td>{{x.Name}}</td>
　　　　　　　　　　　　<td>{{x.Country}}</td>
　　　　　　　　　　　　</tr>
　　　　　　　　</table>
　　　　　　定义和用法
　　　　　　　　　　ng-class-even 指令用于为HTML 元素动态的绑定一个或多个CSS 类，但只能为偶数行。
　　　　　　　　　　ng-class-even 指令需要 与ng-repeat 指令搭配使用。
　　　　　　　　　　ng-class-even 指令建议使用 在表格的样式渲染中，但是所有HTML 元素都是支持的。
　　　　　　　　　　语法 <element ng-class-even="expression"></element>
　　　　　　　　　　参数值：值：expression 描述： 达到指定一个或多个css 类。

ng-class-odd 　　　　　　类似ng-class,但只在奇数行起作用。
　　　　　　　　实例：为表格的偶数行设置 class="striped"；
　　　　　　　　　　<table ng-controller="myCtrl">
　　　　　　　　　　　　<tr ng-repeat="x in records" ng-class-odd="'striped'" >
　　　　　　　　　　　　<td>{{x.Name}}</td>
　　　　　　　　　　　　<td>{{x.Country}}</td>
　　　　　　　　　　　　</tr>
　　　　　　　　</table>
　　　　　　定义和用法
　　　　　　　　ng-class-odd 指令用于为HTML 元素动态的绑定一个或多个CSS 类，但只能为奇数行。
　　　　　　　　ng-class-odd 指令需要 与ng-repeat 指令搭配使用。
　　　　　　　　ng-class-odd 指令建议使用 在表格的样式渲染中，但是所有HTML 元素都是支持的。
　　　　　　　　语法：<element ng-class-odd="expression"></element>
　　　　　　　　参数值： 值： expression 描述： 表达式指定一个或多个CSS 类。

ng-click 　　　　　　定义元素被点击时的行为
　　　　　　　实例：按钮没次点击时，计数变量count自动加1；
　　　　　　　　　　<button ng-click ="count = count + 1" ng-init="count=0">OK</button>
　　　　　　定义和用法
　　　　　　　　　　ng-click 指令告诉了AngularJS HTML 元素被点击后需要执行的操作。
　　　　　　语法：<element ng-click="expression"></element>
　　　　　　参数值： 值：expression 描述: 元素被点击后执行的表达式。

ng-cloak 　　　　　　在应用正要加载时防止其闪烁。
　　　　　　　实例：页面加载时防止应用闪烁。
　　　　　　　　<div ng-app="">
　　　　　　　　　　<p ng-cloak>{{5 + 5}}</p>
　　　　　　　　</div>
　　　　　　定义和用法
　　　　　　　　ng-cloak 指令用于在AngularJS 应用在加载时防止AngularJS 代码未加载完而出现的问题。
　　　　　　语法： <element ng-cloak></element>
　　　　参数值： ng-clock 指令没有参数。

ng-controller 　　　　定义应用的控制器对象。
　　　　　　　　实例：为应用变量添加控制器。
　　　　　　　　　　<div ng-app="myApp" ng-controller="myCtrl">
　　　　　　　　　　　　　　Full Name:{{firstName + " " +lastName}}
　　　　　　　　　　</div>
　　　　　　　　　　<script>
　　　　　　　　　　　　　　var app = angular.module('myApp',[]);
　　　　　　　　　　　　　　app.controller('myCtrl',function($scope){
　　　　　　　　　　　　　　　　$scope.firstName = "John";
　　　　　　　　　　　　　　　　$scope.lastName = "Doe";
　　　　　　　　　　　　})
　　　　　　　　</script>
　　　　　　定义和用法
　　　　　　　　　　ng-controller 指令用于为你的应用添加控制器。
　　　　　　语法：<element ng-controller="expression"></element>
　　　　　　参数值: 值： expression 描述： 控制器

ng-copy 　　　　　　描述：规定拷贝事件的行为。
　　　　　　　实例：在输入框的文本拷贝时执行表达式
　　　　　　　　　　<input ng-copy="count = count + 1" ng-init="count=0" value="Copy this text">
　　　　　　定义和用法
　　　　　　　　　　ng-copy 指令用于告诉AngularJS在HTML 元素文本被拷贝时要执行的操作。
　　　　　　语法： <element ng-copy="expression"></element>
　　　　　　参数值： 值：expression 描述：元素文本被拷贝时执行的表达式。

Angularjs基础(十)的更多相关文章

  1. Angularjs基础(十二)

    ng-model-options 描述:规定如何更新模型 实例: 在失去焦点时绑定输入框的值scope 变量中. <div ng-app="myApp" ng-control ...

  2. AngularJS基础入门初探

    一.AngularJS简介 1.1 什么是AngularJS (1)一款非常优秀的前端JS框架,可以方便实现MVC/MVVM模式 (2)由Misko Hevery 等人创建,2009年被Google所 ...

  3. Bootstrap <基础十九>分页

    Bootstrap 支持的分页特性.分页(Pagination),是一种无序列表,Bootstrap 像处理其他界面元素一样处理分页. 分页(Pagination) 下表列出了 Bootstrap 提 ...

  4. Bootstrap <基础十八>面包屑导航（Breadcrumbs）

    面包屑导航(Breadcrumbs)是一种基于网站层次信息的显示方式.以博客为例,面包屑导航可以显示发布日期.类别或标签.它们表示当前页面在导航层次结构内的位置. Bootstrap 中的面包屑导航( ...

  5. Bootstrap<基础十六> 导航元素

    Bootstrap 提供的用于定义导航元素的一些选项.它们使用相同的标记和基类 .nav.Bootstrap 也提供了一个用于共享标记和状态的帮助器类.改变修饰的 class,可以在不同的样式间进行切 ...

  6. Bootstrap<基础十五> 输入框组

    Bootstrap 支持的另一个特性,输入框组.输入框组扩展自 表单控件.使用输入框组,可以很容易地向基于文本的输入框添加作为前缀和后缀的文本或按钮. 通过向输入域添加前缀和后缀的内容,您可以向用户输 ...

  7. Bootstrap<基础十四> 按钮下拉菜单

    使用 Bootstrap class 向按钮添加下拉菜单.如需向按钮添加下拉菜单,只需要简单地在在一个 .btn-group 中放置按钮和下拉菜单即可.也可以使用 <span class=&qu ...

  8. Bootstrap <基础十二>下拉菜单（Dropdowns）

    Bootstrap 下拉菜单.下拉菜单是可切换的,是以列表格式显示链接的上下文菜单.这可以通过与 下拉菜单(Dropdown) JavaScript 插件 的互动来实现. 如需使用下列菜单,只需要在 ...

  9. Bootstrap<基础十> 响应式实用工具

    Bootstrap 提供了一些辅助类,以便更快地实现对移动设备友好的开发.这些可以通过媒体查询结合大型.小型和中型设备,实现内容对设备的显示和隐藏. 需要谨慎使用这些工具,避免在同一个站点创建完全不同 ...

随机推荐

  1. Java Mail邮件发送的简单实现

    1.什么是java mail JAVA MAIL是利用现有的邮件账户发送邮件的工具,通过JAVA Mail的操控,让程序自动的使用设置的邮箱发送邮件. 这一机制被广泛的用在注册激活和垃圾邮件的发送等方 ...

  2. Javaweb的get请求乱码解决

    get方式请求:即将参数放在URL中,因此这就涉及到URL的编码了 方式一:[推荐] 方式二: 前端编码: encodeURI(encodeURI("")) 后端解码: java. ...

  3. 微信token验证源码分享(c#版)

    在开发时遇到一个问题: 上线后提交申请微信提示"您的服务器没有正确响应token验证...",我查看日志发现根本就没有接收到来自微信的参数. 后来我又记录了微信请求方式和请求的字符 ...

  4. C# 在窗体的子线程中创建新窗体

    在子线程中如果简单的调用新窗体的话,新出来的窗体会直接一闪而过.没有停留.效果很差 具体解决方法 如下: 在母窗体中建立委托 public delegate void setShowChartForm ...

  5. jeecg308 <t:authFilter />标签失效的问题

    <%--该标签放到body末尾会无效,估计是js冲突,放到body前好用--%><t:authFilter /> <body></body>

  6. (五)html部分标签元素补充

    html标签元素十分的多,一次性掌握全部,那是不可能的,在后续的学习中,会不断补充标签元素... 1.行元素和块元素 行标签元素即是标签元素根据内容大小进行自适应,而不是占据一整行. 如<spa ...

  7. 企业Web应用创新实验

    我现在设计一个小而美的管理工具,为此费劲心思搞“创新”.“创新”一词已经被滥用,但我...真的想弄出一点创新. 基于Web的企业应用,如CRM.项目管理.OA等软件,尽管经历十几年发展,所谓的理论有所 ...

  8. VC++上机实习

    I.课程设计基本练习题目(18分×4) [A组]请从以下1-3题中任意选做一题 1.输出1至100之间每位数的乘积大于每位数的和的数,例如对于数字12,有1*2<1+2,故不输出该数:对于27, ...

  9. Java实现队列结构的详细代码

    一.什么是队列结构 一种线性结构,具有特殊的运算法则[只能在一端(队头)删除,在另一端(队尾)插入]. 分类: 顺序队列结构 链式队列结构 基本操作: 入队列 出队列 二.准备数据 static fi ...

  10. Android实现双进程守护

    做过android开发的人应该都知道应用会在系统资源匮乏的情况下被系统杀死!当后台的应用被系统回收之后,如何重新恢复它呢?网上对此问题有很多的讨论.这里先总结一下网上流传的各种解决方案,看看这些办法是 ...