Проверка, вернул ли обещание родительского состояния - PullRequest
0 голосов
/ 31 октября 2019

Использование 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 в контроллере я делаю запрос, жду обещания и затем отображаюДанные для пользователя в таблице. Если пользователь выбирает элемент из таблицы, он отображает дополнительную информацию в дочернем состоянии portfolio.patent, передавая значение идентификатора $stateParams, которое я затем использую для вызова $ http для получения дополнительной информации.

Если я обновляю страницу, дочернее состояние отображается перед родительским состоянием, так как запрос $ http родительского состояния разрешается дольше, так как для извлечения требуется намного больше данных. Я пытался проверить из дочернего состояния значение portfolioLoaded, но он проверяет его только один раз.

Вопрос

Как проверить, что обещание родительского состояния разрешено до отображениядочернее состояние для пользователя?

Я вижу использование ng-show в представлении «portfolio.patent» для проверки контроллера, разрешено ли родительское обещание.

КОНТРОЛЛЕР ПОРТФОЛИО

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

PORTFOLIO.PATENT CONTROLLER

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

ПАТЕНТНЫЙ ВИД

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

Ответы [ 2 ]

1 голос
/ 31 октября 2019

Сохраните обещание в родительском контроллере:

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

Используйте обещание в дочернем контроллере:

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

Это приведет к правильной задержке настройки.

0 голосов
/ 31 октября 2019

Переместить вызов родительского состояния в 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

...