AngularJS ng-change 指令的详解及简单实例
更新时间：2016年07月30日 15:43:38 投稿：lqh
本文主要介绍AngularJS ng-change 指令,这里对ng-change指令资料做了详细介绍，并提供源码和运行结果，有需要的小伙伴参考下
AngularJS ng-change 指令
AngularJS 实例
当输入框的值改变时执行函数:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="myCtrl">
<p>在输入框中输入一些信息:</p>
<input type="text" ng-change="myFunc()" ng-model="myValue" />
<p>输入框已经修改了 {{count}} 次。</p>
</div>
<script>
angular.module('myApp', [])
.controller('myCtrl', ['$scope', function($scope) {
$scope.count = 0;
$scope.myFunc = function() {
$scope.count++;
};
}]);
</script>
</body>
</html>
运行结果：
输入框已经修改了 0 次。
定义和用法
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>
<input>, <select>, 和 <textarea> 元素支持。
参数值
| 值 | 描述 |
|---|---|
| expression | 元素值改变时执行表达式。 |
以上就是对AngularJS ng-change 指令的知识整理，后续继续补充。
相关文章
这篇文章主要介绍了Angular2.js实现表单验证的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-06-06
Angular.js中上传指令ng-upload的基本使用教程
这篇文章主要给大家介绍了关于Angular.js中上传指令ng-upload的基本使用方法，文中通过示例代码介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友们下面跟着小编来一起学习学习吧。2017-07-07
这篇文章主要介绍了AngularJS表单校验用法,结合实例形式分析了AngularJS各种常见的表单校验功能及使用技巧,需要的朋友可以参考下2016-11-11
AngularJS实现select的ng-options功能示例
这篇文章主要介绍了AngularJS实现select的ng-options功能,结合实例形式分析了AngularJS使用ng-options操作select列表的相关实现技巧,需要的朋友可以参考下2017-07-07
这篇文章主要介绍了Angular2生命周期钩子函数的详细介绍，Angular提供组件生命周期钩子，可以让我们更好的开发Angular应用，有兴趣的可以了解一下2017-07-07
这篇文章主要介绍了Angular.js 实现数字转换汉字实例代码的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下2016-07-07
系统的学习了一下angularjs，发现angularjs的有些思想根php的模块smarty很像，例如数据绑定，filter。如果对smarty比较熟悉的话，学习angularjs会比较容易一点,这篇文章给大家介绍angularjs filter用法详解，感兴趣的朋友一起学习吧2015-12-12
本篇文章主要介绍了Angular4 ElementRef的应用，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-02-02
AngularJS2中一种button切换效果的实现方法（二）
这篇文章主要介绍了AngularJS2中一种button切换效果的实现方法（二）,非常不错，具有参考借鉴价值，需要的朋友可以参考下2017-03-03
这篇文章主要介绍了AngularJS select设置默认值的实现方法的相关资料,这里提供实现方法帮助大家实现这样的功能，需要的朋友可以参考下2017-08-08
最新评论