browse other examples

# Adapter: append, prepend and remove sync

This demo had been created to show Adapter 'append', 'prepend' and 'applyUpdates' methods in action. The main point here is that all changes made on the front end have to be synced with the back end. For this purpose a special Server module was introduced to emulate the remote server. The following public methods are implemented by this Server factory:

- request(index, count) just to fetch a bunch of items for the viewport (used by ui-scroll datasource.get);
- appendItem(params) to add one new item (based on params) to the end of the remote data set;
- prependItem(params) to add one new item (based on params) to the beginning of the remote data;
- insertAfterIndex(index, params) to add one new item (based on params) after the item with given index;
- removeFirst() remove first item;
- removeLast() remove last item;
- removeItemById(id) remove one item (based on id).

The initial data set consists of 40 items and can be extended/reduced unlimitedly.

The implementation of the Server factory is not trivial, it is based on indices variations. Also you may see that new items would not be appended (via 'Append one item' or 'Insert some after index' buttons) to the viewport immediately if the EOF (end of file) is not reached. The same is true for prepend operations ('Prepend one item'): BOF (begin of file) must be reached, otherwise your new items will be rendered only after scrolling to the very top...

- {{$index}}: {{item.content}} ({{item.id}}) [x]