什么是Angular JS中的Ng-change，如何为其赋值？
时间：2020-02-23 14:29:36 来源:igfitidea点击:
我们来学习一下AngularJS中提供的有趣指令，例如：ng-change指令，该名称本身会部分放弃它所执行的工作。
程序员通常会在变更事件和ng-change事件之间感到困惑，让我们在此教程 中清除所有内容。
"什么是指令？"
AngularJS指令只是带有前缀ng-的扩展HTML属性。
AngularJS提供了一组内置指令，这些指令为我们的应用程序提供了各种函数。
AngularJS还允许我们定义自己的指令。
"什么是ng-change？"
Ng-change是AngularJS中的指令，用于在更改组件值或者事件时执行操作。
换句话说，ng-change指令告诉AngularJS当HTML元素的值改变时该怎么做。
ng-change指令需要ng-model指令。
使用ng-change指令时的重要要点：
onChange事件会怎样？ AngularJS的ng-change指令不会覆盖元素的原始onchange事件，ng-change表达式和原始onchange事件都将被执行。
每次更改值时都会触发ng-change事件。它不会等待所有更改完成，也不会等待输入字段失去焦点。
仅当输入值发生实际更改时才触发ng-change事件，如果更改是通过JavaScript进行的，则不会触发ng-change事件。
HTML标记(例如<input>，<select>和<textarea>)支持此ng-change指令。
仅当输入值的更改导致将新值提交给模型时，才评估ngChange表达式。
它将不被评估：
如果$parsers转换管道返回的值未更改
如果输入继续无效，则模型将保持为空
如果模型不是通过输入值而是通过编程方式进行更改。
注意，该指令要求存在ngModel。
语法：
<element ng-change=“expression”></element>
expression：指定当元素的值更改时执行的表达式。
示例：
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body ng-app="App1">
<div ng-controller="Cng1">
<p>Please type in the input field:</p>
<input type="text" ng-change="myFunc()" ng-model="Val"
<p>The input field has changed {{count}} times.</p>
</div>
<script>
angular.module('App1', [])
.controller('cng1l', ['$scope', function($scope) {
$scope.count = 0;
$scope.myFunc = function() {
$scope.count++;
};
}]);
</script>
</body>
</html>
输出(3次更改后)
请在输入字段中输入：
输入字段已更改3次。
