Angular嵌套循环承诺

时间:2017-02-10 08:33:54

标签: angularjs sqlite api cordova promise

我正在尝试使用SQLite plugin构建一个Cordova / angular应用程序以使其脱机工作但我对数据库的查询的承诺和异步有很多麻烦这是我的情况:

我有5个像这样配置的表:

包含id,title,template_id和body的表页面 带有id和标签的表菜单 表格PageMenus具有id和page_id,menu_id用于关联页面和菜单 具有id menu_id和body的表MeniItems与"实际"教学菜单中的元素 带有id和标签的表格模板,用于选择正确的视图

出于兼容性原因(我在webapp和移动应用程序中使用相同的代码,对于webapp我在移动设备上调用我的API我下载了设备上的所有内容)我需要在这种格式:

{
  "id": 1
  "body": "Welcome to the homepage",
  "title": "Homepage",
  "template_tag": "tab",
  "menus": [
    {
      "id": 3,
      "tag": "home_menu",
      "menu_items": [
        {
          "menu_id": 3,
          "body": "Movie"
        },
        {
          "menu_id": 3,
          "body": "Restaurant"
        },
        {
          "menu_id": 3,
          "body": "Messages"
        },
        {
          "menu_id": 3,
          "body": "Systems"
        }
      ]
    },
    {
      "id": 62,
      "tag": "user_menu",
      "menu_items": [
        {
          "menu_id": 62,
          "body": "About"
        },
        {
          "menu_id": 62,
          "body": "Updates"
        },
        {
          "menu_id": 62,
          "body": "Help"
        },
        {
          "menu_id": 62,
          "body": "Reset Password"
        },
        {
          "menu_id": 62,
          "body": "Report/ Feedback"
        }
      ]
    }
  ]
}

我已经能够获得正确的格式但我的问题是控制器在解决之前尝试访问菜单的主体,因此我得到错误未定义这是我在我使用的代码在工厂:

return {
  getHomePage: function() {
    // other function
  },
  getPage: function(id) {
    var results = $q.defer();

    function request() {
      var res = {};
      var queryPage = "SELECT pages.id, pages.body, pages.title, templates.tag AS template_tag FROM pages JOIN templates ON pages.template_id = templates.id WHERE pages.id = ?";
      $cordovaSQLite.execute(db, queryPage, [id]).then(function(page) {
        res = page.rows.item(0);
        res.menus = [];
        var queryMenus = "SELECT menus.id, menus.tag FROM menus JOIN page_menus ON menus.id = page_menus.menu_id WHERE page_menus.page_id = ?";
        $cordovaSQLite.execute(db, queryMenus, [res.id]).then(function(menus) {
          for (var i = 0; i < menus.rows.length; i++) {
            var menu = {
              id: menus.rows.item(i).id,
              tag: menus.rows.item(i).tag,
              menu_items: []
            };
            var queryMenuItems = "SELECT * FROM menu_items JOIN menus ON menu_items.menu_id = menus.id where menus.id = ?"
            $cordovaSQLite.execute(db, queryMenuItems, [menus.rows.item(i).id]).then(function(menu_items) {
              for (var i = 0; i < menu_items.rows.length; i++) {
                menu.menu_items.push(menu_items.rows.item(i));
              }
            });
            res.menus.push(menu);
          };
          results.resolve(res);
        });
      });
    };
    request();

    return results.promise;
  },
  getMedia: function(id) {
    // other function
  }
};

2 个答案:

答案 0 :(得分:0)

将承诺链接起来是一种很好的做法:

getSomething: function(...) {
    return requestReturningPromise1.then(function(resultOfPromise1) {
        // Do something here (prepare next request,...)
        return requestReturningPromise2;
    }).then(function(resultOfPromise2) {
        // Do something here (prepare next request,...)
        return requestReturningPromise3;       
    }).then(function(resultOfPromise3) {
        // Do something here (prepare next request,...)
        return finalReturn;       
    });
}

嵌套减少,更易读,更容易调试。 因此将其应用于您的代码会产生以下结果:

getPage: function(id) {
    var res = {};
    var queryPage = "SELECT pages.id, pages.body, pages.title, templates.tag AS template_tag FROM pages JOIN templates ON pages.template_id = templates.id WHERE pages.id = ?";
    return $cordovaSQLite.execute(db, queryPage, [id]).then(function(page) {
        res = page.rows.item(0);
        res.menus = [];
        var queryMenus = "SELECT menus.id, menus.tag FROM menus JOIN page_menus ON menus.id = page_menus.menu_id WHERE page_menus.page_id = ?";
        return $cordovaSQLite.execute(db, queryMenus, [res.id]);
    }).then(function(menus) {
        var menuPromises = [];
        for (var i = 0; i < menus.rows.length; i++) {
            var menu = {
                id: menus.rows.item(i).id,
                tag: menus.rows.item(i).tag,
                menu_items: []
           };
            var queryMenuItems = "SELECT * FROM menu_items JOIN menus ON menu_items.menu_id = menus.id where menus.id = ?";
            var menuPromise = $cordovaSQLite.execute(db, queryMenuItems, [menus.rows.item(i).id]).then(function(menu_items) {
                for (var i = 0; i < menu_items.rows.length; i++) {
                    menu.menu_items.push(menu_items.rows.item(i));
                }
                return menu;
            });    
           menuPromises.push(menuPromise);                        
        }
        return Promise.all(menuPromises);        
    }).then(function(menus) {
        for (var i = 0; i < menus.length; i++) {
            res.menus.push(menus[i]);
        }
        return res;
    });
}

请注意,在上面的代码中,服务本身会返回一个promise,因此您必须在控制器中使用它:

MyService.getPage(id).then(function(page) {
     // here, bind the result page to your controller scope ...
});

答案 1 :(得分:0)

这就是我最终要做的事情(即使我不认为对其他人有帮助,我也会发布它,因为它主要基于我的数据库结构):

var promisePage = $cordovaSQLite.execute(db, "SELECT p.*, t.tag AS template_tag FROM pages AS p JOIN templates AS t ON p.template_id = t.id WHERE p.id = ?", [id]);
var promiseMenus = $cordovaSQLite.execute(db, "SELECT m.* FROM menus AS m JOIN page_menus AS pm ON m.id = pm.menu_id WHERE pm.page_id = ?", [id]);
var promiseMenuItems = $cordovaSQLite.execute(db, "SELECT mi.* FROM menu_items AS mi JOIN menus AS m ON mi.menu_id = m.id JOIN page_menus AS pm ON pm.menu_id = m.id WHERE pm.page_id = ?", [id]);

return $q.all([promisePage, promiseMenus, promiseMenuItems]).then(function(data) {
  var page = data[0].rows.item(0);
  var menus = data[1];
  var menuItems = data[2];
  // here there is some boring code to construct the page
  return page;

在我得到页面后,我不再查询数据库中的菜单和菜单项,而是并行查询所有三个元素,然后在$ q.all中完成所有工作。