When it comes to radio buttons, they should be checked based on certain conditions.
<input data-ng-checked="user.contract1 || user.contract2" data-ng-model="user.agreed" type="radio" data-ng-value="true"> Yes
<input data-ng-checked="!user.contract1 && !user.contract2" data-ng-model="user.agreed" type="radio" data-ng-value="false"> No
The model user.agreed holds true or false depending on whether the user has agreed:
If the user has agreed to any contract, then
user.agreed = trueIf the user has not agreed to any contract, then
user.agreed = false
Sometimes, upon loading the page, the radio button is selected on 'No' instead of 'Yes'. This issue may arise due to the digest cycle completing before fetching data from the server.
I expected two-way binding to ensure that changes in the user model reflect in the view. When data loads from the server, the model updates with new information, and the view should display these changes accordingly.
However, this mechanism isn't working as anticipated. How can I make sure that ng-checked accurately reflects my model's changes?
EDIT controller snippet:
app.controller('TestCtrl', ["QueryService", function(QueryService) {
$scope.user = {
contract1 = false;
contactt2 = false;
};
QueryService.getUser().success(function(user) {
$scope.user = user;
});
});