When the page loads, my AngularJS controller.js initializes the scope model by fetching data from an AJAX response:
services.InitializePage().then(function (response) {
$scope.DataModel = response.data;
Shortly after that, the model undergoes a change:
$scope.DataModel.SameAsShipToAddress = false;
However, despite this change, the radio button on the view fails to reflect the updated value and remains unselected:
<input type="radio" name="SameAsShipToAddress" ng-model="DataModel.SameAsShipToAddress" ng-click="setSameAsShipAddress(true)" value="true" />
<input type="radio" name="SameAsShipToAddress" ng-model="DataModel.SameAsShipToAddress" ng-click="setSameAsShipAddress(false)" value="false" />
IMPORTANT: If I modify the model outside of the InitializePage method, the UI radio button updates. (I have confirmed this by setting a breakpoint and verifying that the services.InitializePage().then(function (response) block is executed)