检查父状态承诺是否已返回值

Question

使用 AngularJS 和 ui-router 创建状态，我有父状态和子状态。

    .state('portfolio', {
        url: '/portfolio',
        templateUrl: 'app/templates/portfolio/portfolio.tpl.htm',
        controller: 'portfolioCtrl',
        controllerAs: '$ctrl'
    })
    .state('portfolio.patent', {
        url: '/:patentId',
        views:{
            "": {
                controller: 'caseOverviewCtrl',
                controllerAs: '$ctrl',
                templateUrl: 'app/templates/patent/case-overview.tpl.htm',
            },
            //FURTHER SIBLING VIEWS
       }
     })

在 portfolio 中，我在控制器中发出请求，等待承诺，然后在 table 中向用户显示数据。如果用户从 table 中选择一个项目，它会在子状态 portfolio.patent 中显示更多信息，将 id 值传递给 $stateParams，然后我使用它来调用 $http获取更多信息。

如果我刷新页面，子状态显示在父状态之前，因为父状态 $http 请求需要更长的时间来解析，因为要获取更多数据。我试图从子状态检查 portfolioLoaded 的值，但它只检查一次。

问题

如何在向用户显示子状态之前检查父状态承诺是否已解决？

我看到在“portfolio.patent”视图中使用 ng-show 来检查控制器是否已解决父承诺。

投资组合控制器

var promise = patentsRestService.fetchAllPatents();
promise.then(
    function(response){
        var patents = response;
        $scope.portfolioLoaded = true;
    }
)

PORTFOLIO.PATENT 控制器

function init() {
    if($scope.$parent.portfolioLoaded) {
        $scope.parentLoaded = true;
    }
}

专利视图

<div data-ng-show="$ctrl.portfolioLoaded" class="animate-show">
   //CONTENT
</div>

Answer 1

将父州的调用移至 resolve:

.state('portfolio', {
    url: '/portfolio',
    templateUrl: 'app/templates/portfolio/portfolio.tpl.htm',
    controller: 'portfolioCtrl',
    controllerAs: '$ctrl',
    resolve: {
        patentData: function(patentsRestService){
            return patentsRestService.fetchAllPatents()
        }
    }
})

它将始终在子状态加载之前解决

阅读更多：https://github.com/angular-ui/ui-router/wiki#resolve

Answer 2

在父控制器中保存承诺：

$scope.promise = patentsRestService.fetchAllPatents();
$scope.promise.then(
    function(response){
        var patents = response;
        $scope.portfolioLoaded = true;
    }
)

在子控制器中使用promise：

function init() {
    $scope.$parent.promise.then(function() {
        $scope.parentLoaded = true;
    });
}

这将适当延迟设置。

检查父状态承诺是否已返回值

Checking if parent state promise has returned value

javascript

angularjs

angular-ui-router

问题

投资组合控制器

PORTFOLIO.PATENT 控制器

专利视图