promises workflow in angular js, regarding pouchDB

Question

I'm trying to write some code in Angular js, it's my first time so there still are things I don't know. I'm also using PouchDB, and following my logic I'd like to do:

check is the DB has some stuff in it
if yes, destroy it, and create a new one
put new stuff in the DB

It seems pretty straightforward but probably I'm getting lost in the promises...

if (stuffInsideDB != undefined && stuffInsideDB !='')
{                       
    db.destroy().then(
        function(result)
        {
            db = new PouchDB('DB');
            db.info();                  
        }
    );
}
db.put(
    {
        _id: (currentIndex + 1).toString(),
        "data": encryptedHex.toString()
    }
).then(
    function() 
    { //do something}
);

Executing this code, it's executing the put before the destroy (and of course I'm getting an error). Is it because I'm not doing something like destroy().then(create().then(put())) ?

Many thanks

refer: https://stackoverflow.com/questions/13033118/angular-js-how-to-bind-to-promises?rq=1 — Sunny, Mar 23 '18 at 18:19

score 0 · Answer 1 · answered Mar 23 '18 at 15:23

There may be number of solutions to this question. As you are interested in promises, here is a way to find out solution with promises: Note: I did not run this code locally, so you can take this as reference only.

You can create a function to perform all the operations that you have mentioned in the question and return a promise from it, something like:

return new Promise(function (resolve, reject) {
    if (stuffInsideDB != undefined && stuffInsideDB !=''){
        resolve(1);
    }else{
        reject();
    }

}).then(function (result) {
    return db.destroy();
}).then(function (result) {
        db.put(
            { _id: (currentIndex + 1).toString()
                ,"data": encryptedHex.toString()
            });
}).then(function (result) {
   //do something
});

Does it answer you question? – Kishor Jadhav Mar 23 '18 at 17:48 — Kishor Jadhav, Mar 23 '18 at 17:48

georgeawg · Answer 2 · 2018-03-23T18:15:50.160

With AngularJS it is important to wrap PouchDB promises in $q.when(). This will notify AngularJS to update the UI when the PouchDB promise has resolved.

The .then method of a promise returns a new promise that can be used for chaining actions. When chaininig promises, it is important to return values and promises to the handler function.

var promise = $q.when();

if (stuffInsideDB != undefined && stuffInsideDB !='')
{                       
    promise = db.destroy().then(
        function(result)
        {
            db = new PouchDB('DB');
            return db.info();                  
        }
    );
}

promise =  promise
 .then(function() {
   //IMPORTANT return the `db.put` promise
   return db.put(
    {
        _id: (currentIndex + 1).toString(),
        "data": encryptedHex.toString()
    }
).then(
    function() 
    { //do something}
);

return $q.when(promise);

The first part creates either an empty promise or a promise to destroy. The second part chains the db.put operation after that. The final part converts the ES6 promise to an AngularJS promise that is integrated with the AngularJS framework and its digest cycle.

For more information, see AngularJS $q Service Promise API Reference.

promises workflow in angular js, regarding pouchDB

2 Answers2