为什么在解决父状态promise之前执行子状态解析函数

Question

我正在使用ui-routerv0.2.13.此页面指出:

在进入下一个状态之前,所有在一个状态下解决的问题都将得到解决,即使它们没有被注入该孩子

和更多

在转换将进入任何状态之前触发并解析所有正在输入的状态的所有状态(无论是否在某处注入了解析)

但是,在我的情况下,在解析父解析承诺之前执行子状态解析功能.这怎么可能？

这里:

$stateProvider
    .state('route1', {
        url: "/route1",
        templateUrl: "route1.html",
        resolve: {
            parent: ["$timeout", "$q", function ($timeout, $q) {
                var d = $q.defer();
                $timeout(function () {
                    d.resolve();
                }, 5000);
                return d.promise;
            }]
        }
    })
    .state('route1.list', {
        url: "/list",
        templateUrl: "route1.list.html",
        controller: function ($scope) {
            $scope.items = ["A", "List", "Of", "Items"];
        },
        resolve: {
            child: function () {
                alert("I'm shown before `parent` resolved");
            }
        }
    });

如果您导航到/route1/list警报立即显示,而不是等待5秒,直到解决了父解析承诺.

Answer 1

所有解析都保证在实际执行转换之前得到解析。但这些语句并没有指出解析函数将被同步调用。这是正确的。

根据ui-router 源代码，调用被解析为尽可能“并行”。只有依赖于其他调用（来自父级或当前状态声明）的调用才会在其依赖关系解决后执行。

child因此，使invocable 在解析后被调用的唯一方法parent是指定parent为childinvocable 的依赖项。

.state("route1",{
   //..
   resolve: {
        parent: ["$timeout", "$q", function ($timeout, $q) {
            var d = $q.defer();
            $timeout(function () {
                d.resolve();
            }, 5000);
            return d.promise;
        }]
    }
 })
 .state("route1.list",{
    //...
    resolve: {
         child: ["parent", function(parent) {
             //will be called only after parent is resolved
         }]
 })

摘自GitHub的resolve.js源码注释：

一旦所有依赖项可用，就会立即调用可调用项。parent即使对于从调用继承的依赖项也是如此$resolve。