Whenever I try to populate a scope array property by calling an AJAX service, the data gets filled in as expected. However, I am faced with the issue that I have to interact with another control or click somewhere on the page to actually display the array.
Here is the structure of the array:
<ul class="list-group">
<li class="list-group-item" ng-repeat="address in proposaladdresses">
{{address.FormattedAddress}}
<input type="button" ng-click="SubmitAddress(address.RefId, $parent.$index)" class="btn btn-success btn-sm pull-right" value="Select"/>
</li>
</ul>
The array is populated using this code snippet:
$scope.proposaladdresses = [];
$.ajax({
url: url,
dataType: "jsonp",
data: {
"key": 'dasdasdas',
"AddressLine": $scope.CustomAddress,
},
success: function (data) {
if (data) {
$scope.proposaladdresses = data;
}
},
});
Can anyone explain why an extra step is needed to visualize the data on the screen?