Angular 2 Data Persistence

Question

Our dev team started the great switch to the Angular2/Ionic2 framework, and one small detail left us puzzled - which is the best way to achieve data persistence? I've found an almost two year old Google Doc on a Design for Ang2 Data Persistence, however, it doesn't seem like it's been implemented at all. The most important functions I need are:

1. binding the data on client and server side, so every change gets automatically committed
2. local dataset to work with when the application goes offline
3. caching the offline work, syncing it with the backend immediately on reconnection

(In short, the functionality of Swarm.js for example) I've searched blogs, stackoverflow, but so far no answer - as far as I understood I can't even use widely accepted external solutions, such as PouchDB to solve this problem, and constantly making http get/post calls with manual caching in localStorage won't do it for the projects we're working on. What do you think? Is there a way to achieve this?

Answer 1

PouchDB dev here. In principle, you can use any client-side database with Angular. Personally I've written a few Angular apps that used straight-up PouchDB (never saw a need for angular-pouchdb TBH). Here's an open-source example: https://github.com/pouchdb/npm-browser

PouchDB is optimized for syncing with CouchDB, though. If you just want a simple key-value storage API to replace LocalStorage, I'd recommend LocalForage. It's promise-based, so you can just wrap it with $q.when() and use it in an Angular service, and it should feel pretty native to Angular.