user6579134 user6579134 - 4 months ago 9
AngularJS Question

making calculation with two fields, one with ng-model in angular

i'm trying to add two fields together and get out the sum. but the isssue is when i add ng-model to one of the textfields the binded value in it dissappears. when i remove the ng-model from it the binded values shows up. How do i make the binded values appear in the textfield while using ng-model.

<div ng-controller="items" ng-repeat="item in data">
<label class="item item-input">
<span class="input-label">Current Quantity</span>
<input type="text" value="{{item.quantity}}" ng-model="first">

</label>
<label class="item item-input">
<span class="input-label">New Stock</span>
<input type="text" placeholder="New stock about to be added" ng-model="second">
</label>
<br>
<h1> New Stock: {{first--second}}! </h1>
</div>


JS

.controller('updatestock_ctrl',['$scope','$http','$state','$stateParams',function($scope,$http,$state,$stateParams){
$http.get('http://localhost/masa/templates/spree/stocks/update_stock.php?item_id='+$stateParams.item_id).success(function(data){
console.log(JSON.stringify(data));
$scope.data=data;
});
}])

Answer

Instead of using the value HTMLAttribute for the input, you should just declare the ng-model which will tie the value automatically for both reading and writing:

<input type="text" ng-model="item.quantity">