<form> Low Range: <input type="number" name="lowRange" ng-model="weight" ng-model-options = "{updateOn:'submit'}"> <button type="submit">Assign</button> <button type="button" ng-click="resetValue()">Discard</button> </form> <p>The value of <strong>weight</strong> is connected to <code>ng-model. Using the directiveng-model-options="{updateOn:'submit'}", the value ofng-modelonly updates upon clicking the submit button.
If a user modifies the input value and clicks discard, the intention is to reset the input box to match the currentng-modelvalue.
This is achieved by calling a function withng-click="resetValue()"$scope.resetValue = function(){ $scope.weight = $scope.weight; // Adding +1 here would update ng-model but not needed }However, when attempting to assign the same variable values, it doesn't work as expected due to reference assignments. The value in the input box remains unchanged. Is there a way to force the input value bound to
ng-modelto reflect the updated value?Check out a live demo here: http://plnkr.co/edit/NQTieUmdEbxZeBsjk8Jw?%2F=preview&p=preview