Question

我将有N个输入字段，每个字段都有一个值CHANGE而不会进入或离开焦点。如何检测每个输入字段的值更改。

我只找到一个question相关并使用了我尝试过的但是它无效。可以任何人进一步帮助

for (var i=0;i<$scope.customers.product.length;i++)
{
//i m trying to get unique ids and bining input fields for change 
$('#total-i').on('input', function() { 
    alert($(this).val()); // get the current value of the input field.
});
}

//there will be multiple of input fields having unique ids
<input id="total-{{$index}}" value={{cust.price*cust.quantity}}"/>

Answer 1

只要您输入ng-change，ng-model即可轻松实现。

<input id="total-{{$index}}" value={{cust.price*cust.quantity}}" ng-model="total" ng-change="updatemethod()"/>

total and updatemethod()应该是控制器$scope的一部分。

Answer 2

您在问题中链接的问题与Angular无关（它使用jQuery）。 Angular way 在哪里（考虑到您使用ng-repeat显示输入）：

<div ng-repeat="i in items">
    <input ng-model="i" ng-change="update(i)"/>
</div>

使用此代码，无论何时更新i（例如：何时更改输入值），都会触发update(i)方法。

这是我正在解释的一个很小的例子：

function MyCtrl($scope) {
    $scope.items = ['1', '2', '3', '4', '5'];
    
    $scope.update = function(item) {
        alert(item + ' has been changed!');
    }
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app ng-controller="MyCtrl">
    <div ng-repeat="i in items">
        <input type="text" ng-model="i" ng-change="update(i)"  />
    </div>
</div>

Answer 3

我创建了一个与ng-model关联的对象，然后观察它。既然你没有提供一个小提琴实例的Codepen来干涉，我不确定这是否有效，请查看。

//for each index
$.each(modelObject, function(key, value) {
   //set a watcher
   var watchString = "modelObject[" +key + "]";  
   $scope.$watch(watchString, function (newValue, oldValue) {
      $scope.update(modelObject[key]);
   });
});

如何检测ng-repeat

3 个答案: