AngularJS nested ng-repeat doesn't modify model - angularjs

Question

I am trying to loop through a nested object and use a checkbox to toggle the attribute. I am using nested ng-repeat statements. The data displays fine but when I go to save the data, it turns out its not actually modifying the ng-model like it normally would. Is there something that I am missing here?
Here is the HTML:
<div class="settings-container">
<div ng-repeat="(key, category) in vm.graphSettings">
<div class="row">
<div class="col-xs-12">
<h3>{{ key | titleCase }}</h3>
</div>
</div>
<div class="row">
<div class="col-lg-8 col-md-10 col-xs-12">
<div class="row select-row">
<div class="col-xs-3" ng-repeat="(id, value) in category">
<div class="checkbox">
<label>
<input type="checkbox" ng-model="value">
<div class="pseudo-checkbox"></div>
<span class="input-name">{{ id | titleCase }}</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
and here is the object the above vm.graphSettings is reflecting.
graph: {
general: {
showLegend: false,
showNullValues: false,
showTitle: false,
},
xAxis: {
showLabel: false,
showXAxis: true,
dynamicLines: true
},
yAxis: {
showLabel: false,
showYAxis: false
}
}

Answer 1

The ng-model should be the name of a model property, not the value itself:
<div class="settings-container">
<div ng-repeat="(key, category) in vm.graphSettings">
<div class="row">
<div class="col-xs-12">
<h3>{{ key | titleCase }}</h3>
</div>
</div>
<div class="row">
<div class="col-lg-8 col-md-10 col-xs-12">
<div class="row select-row">
<div class="col-xs-3" ng-repeat="(id, value) in category">
<div class="checkbox">
<label>
̶<̶i̶n̶p̶u̶t̶ ̶t̶y̶p̶e̶=̶"̶c̶h̶e̶c̶k̶b̶o̶x̶"̶ ̶n̶g̶-̶m̶o̶d̶e̶l̶=̶"̶v̶a̶l̶u̶e̶"̶>̶
<input type="checkbox" ng-model="category[id]">
<div class="pseudo-checkbox"></div>
<span class="input-name">{{ id | titleCase }}</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>