AngularJS ng-change 指令
AngularJS 實例
當輸入框的值改變時執行函數:
< 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 >
< script >
< div ng-controller= "myCtrl" >
< input type= "text" ng-change= "myFunc()" ng-model= "myValue" / >
< p > The input field has changed {{count}} times. < /p >
< /div >
< script >
angular.module( 'myApp' , [])
.controller( 'myCtrl' , [ '$scope' , function ($scope) {
$scope.count = 0 ;
$scope.myFunc = function () {
$scope.count++;
};
}]);
.controller( 'myCtrl' , [ '$scope' , function ($scope) {
$scope.count = 0 ;
$scope.myFunc = function () {
$scope.count++;
};
}]);
< /script >
< /body >
< /body >
嘗試一下»
定義和用法
ng-change指令用於告訴AngularJS在HTML元素值改變時需要執行的操作。
ng-change指令需要搭配ng-model指令使用。
AngularJSng-change指令指令不會覆蓋原生的onchange事件,如果觸發該事件， ng-change表達式與原生的onchange事件都會執行。
ng-change事件在值的每次改變時觸發，它不需要等待一個完成的修改過程，或等待失去焦點的動作。
ng-change事件只針對輸入框值的真實修改，而不是通過JavaScript來修改。
語法
< element ng-change= " expression " > < / element >
<input>, <select>, 和 <textarea> 元素支持。
參數值
| 值 | 描述 |
|---|---|
| expression | 元素值改變時執行表達式。 |