AngularJS ng-change 指令

AngularJS 參考手冊

定義和用法

ng-change 指令告訴 AngularJS 當 HTML 元素的值發生變化時要執行的操作。

ng-change 指令要求存在 ng-model 指令。

AngularJS 中的 ng-change 指令不會覆蓋元素的原始 onchange 事件，ng-change 表達式和原始 onchange 事件都將被執行。

ng-change 事件在值每次發生變化時觸發。它不會等到所有更改都完成，或者當輸入框失去焦點時才觸發。

ng-change 事件只有在輸入值實際發生變化時才會觸發，而不是通過 JavaScript 進行的更改。

實例

當輸入框的值發生變化時，執行一個函數：

<body ng-app="myApp">
<div ng-controller="myCtrl">
    <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>

親自試一試

語法

<element ng-change="expression"></element>

支持 <input>、<select> 和 <textarea>。

參數

參數 描述
expression 當元素的值發生變化時要執行的表達式。

AngularJS 參考手冊