angularjs - 解决 routeprovider 中的多个 promise

Question

所以我想执行 2 个 http 调用以从我的服务器获取一些组和问题，并在 routeprovider 中解决这两个问题，以便在我获得相关数据之前不会加载相应的 Controller 。

在我的其他 Controller 中，我总是使用一个 initalData 对象来保存数据。

解决部分:

resolve: {
                initialData: ["GroupsService" "QuestionsService", function (GroupsService, QuestionsService) {
                    return {
                     questions: QuestionsService.getAll(),
                     groups: GroupsService.getAll()
                }]
          }

当我尝试分别使用 initialData.questions 和 initialData.groups 访问 Controller 中的数据时，尽管在 Controller 实例化之前记录了来自 http 的回调，但我收到了 2 个 promise 而不是数据。

QuestionsCtrl.$inect = ["DialogsService", "initialData", "QuestionsService"];

function QuestionsCtrl(DialogsService, questions, groups, QuestionsService) {
//Initialdata object which has 2 Promise properties
//This logs AFTER the callback in both http callbacks
console.log('controller initialized', initialData);

当我用这个替换代码时(没有使用 initialData 对象，而是返回了另外两个对象，它确实有效:

 resolve: {
                    questions: function (QuestionsService) {
                        //$http call for all questions
                        return QuestionsService.getAll();
                    },
                    groups: function (GroupsService) {
                        //$http call for all groups
                        return GroupsService.getAll();
                    }
                }

有没有人对为什么有任何合乎逻辑的解释，在第一种情况下我得到了 promise (尽管数据实际上存在于客户端中)，而第二种情况却完美无缺？

Answer 1

当您通过resolve到一条路线 it calls $q.all on it implicitly for you .因此，当您在 resolve 中返回多个值时，它会等待所有值都完成。

在你的例子中——你刚刚返回了一个包含一些 promise 值的对象——你没有等待它们，所以它立即用 promise 解决而不是解开它们。

您当然也可以明确地等待它们:

 initialData: ["a" "b","$q" function (a, b, $q) {
      return $q.all({
                     questions: a.getAll(),
                     groups: b.getAll()
             });
 }]