I have an instance where I'm replacing the value of ngModel
through ngChange
. The cursor jumps to the end of the input
field after each change (assuming because I'm assigning the result to the same $scope
variable.)
I'd like to know how I can prevent this behavior?
$scope.compute1 = 0;
$scope.compute2 = 10;
$scope.math = function() {
$scope.compute1 = parseInt($scope.compute1);
$scope.compute2 = parseInt($scope.compute2);
$scope.compute1 = parseInt($scope.compute1);
};
Example of problem: if a user types in 1000. It's fine. But then if they want to go back and change the number to 156000 by just adding the 5 and 6, the 6 would actually be appended to the end: 15006.
Two suggestions:
1 Why not just use number input.
<div ng-app='myApp'>
<div ng-controller="myCtrl">
<input id="compute1" ng-model="compute.c1" ng-change="math()" type="number"/>
<input id="compute2" ng-model="compute.c2" ng-change="math()" type="number"/>
</div>
</div>
2 Two-Way databinding should always be used with the "dot" notation:
$scope.compute = {c1: 0, c2: 10};
$scope.math = function() {
$scope.compute.c1 = parseInt($scope.compute.c1);
$scope.compute.c2 = parseInt($scope.compute.c2);
};
and update your html accordingly to have ng-model="compute.c1" etc.