I am trying to figure out how to add a "discountRate" property to an ng-model object after it has been changed within an ng-repeat block.
Check out this example for more information
Another example can be found here
Although the ng-model is updated as expected after selecting an option, the "discountRate" property is not being added. It seems like there might be something related to the "scope" that I am missing. Can someone please take a look at this and help me understand how to add the "discountRate" property to the ng-model?
<form class="form-horizontal" ng-submit="addToInvoice()">
<div class="form-group">
<label for="inputService" class="col-sm-2 control-label">Service</label>
<div class="col-sm-4">
<select name="data.itemToSave" class="form-control" required="required"
ng-options="option.title for option in items.services track by option.id"
ng-model="data.itemToSave"></select>
</div>
</div>
<div class="form-group">
<label for="inputPrice" class="col-sm-2 control-label">Discount</label>
<div class="readonly" data-toggle="buttons">
<label class="btn btn-default" ng-class="{active: '!data.itemToSave.discountRate'}">
<input type="radio" ng-model="data.itemToSave['discountRate']" value="0">0%</label>
<label class="btn btn-default">
<input type="radio" ng-model="data.itemToSave['discountRate']" value="10">10%</label>
<label class="btn btn-default">
<input type="radio" ng-model="data.itemToSave['discountRate']" value="20">20%</label>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-4">
<button type="submit" class="btn btn-default">Add to Invoice</button>
</div>
</div>
</form>