Below is my scenario.
I have 2 checkboxes named A & B which are inside the ng-repeat element. The possible states of these 2 checkboxes are
- When A is truthy, B can be either truthy or falsey
- When A is falsey, B can never be truthy.
Below is my code which I tried with ng-checked, but as ng-checked doesn't allow ng-model along with it, I couldn't come up with a solution.
NOTE: I need to capture both these 2 checkboxes state in my Model
<tbody>
<tr ng-repeat="vehicle in editor.vehicles">
<td>
<v-check name="A" ng-model="vehicle.modelA"></v-check>
</td>
<td>
<v-check name="B" ng-model="vehicle.modelB" ng-checked="vehicle.modelA"></v-check>
</td>
</tr>
</tbody>
Above code uses a directive v-check
which is nothing but a checkbox.
EDIT:
The template of my v-check
directive:
<label class='checkbox-inline'><input ng-model='ngModel' type='checkbox'>{{text}}</label>
Thanks in advance.
Below is my solution to the problem, which also fixes the scenario as suggested by @entre in his comment.
<tbody>
<tr ng-repeat="vehicle in editor.vehicles">
<td>
<v-check name="A" ng-model="vehicle.modelA" ng-click="vehicle.modelB=false"></v-check>
</td>
<td>
<v-check name="B" ng-model="vehicle.modelB" ng-disabled="!vehicle.modelA"></v-check>
</td>
</tr>
</tbody>