In my current setup, I have a view that displays a list of items:
<li ng-repeat="item in items">{{item.name}}</li>
The associated service code is as follows:
angular.module('itemService', ['ngResource']).
factory('Item', function($resource){
return $resource('/api/v1/item/:itemId', {}, {
query: {method:'GET', params:{itemId : ''}, isArray : true},
get: {method:'GET', params:{itemId : ''}, isArray : false},
save: {method:'POST', params:{itemId : ''}, isArray : false},
update: {method:'PUT', params:{itemId : '@_id.$oid'}, isArray : false}
});
});
Additionally, upon controller initialization, I utilize the query() function to fetch the list of items.
function ItemCtrl($scope, Item) {
$scope.items = Item.query();
....
At some point on the same page, I have the ability to create new items and use the save() function to save them to the server. What I aim to achieve is to dynamically update the view to display the new item without refreshing the entire list using query(). Given that the view serves as the official record, I believe it is proper practice to append the newly saved item to the end of the existing items array once the save operation succeeds. Hence, I'm keen on learning how to specify a callback for the save() function to handle this task effectively.
UPDATE: The save() function does return a copy of the successfully saved item, hence ensuring that the saving process was successful on the server side.