On my webpage, I have implemented an ng-repeat directive. The initial loading of the page displays the data as expected through this directive. However, I am looking for a way to dynamically refresh the content of the directive using an ng-click function. Despite attempting various approaches, I am unable to achieve my desired outcome. Can anyone provide any suggestions or solutions?
<div ng-click="loadItems('1')">Load 1st set of items</div>
<div ng-click="loadItems('2')">Load 2nd set of items</div>
...
<table>
<tr ng-repeat="item in items">>
// stuff
</tr>
</table>
ItemsCtrl:
$scope.loadItems = function (setID) {
$http({
url: 'get-items/'+setID,
method: "POST"
})
.success(function (data, status, headers, config) {
$scope.items = data;
})
.error(function (data, status, headers, config) {
$scope.status = status;
});
};
I attempted to utilize the loadItems() function in hopes that it would trigger the refreshing of the ng-repeat directive with updated data fetched from the server.