Question

我有一个设置，我在基础级别上切换各种视图以进行多变量测试。我正在使用嵌套的ui-view来完成此任务而不会出现问题，但是在一个布局中，我希望延迟仅嵌套视图的加载，直到某些资产已加载为止。 / p>

目前我只能推迟儿童和儿童。父母，无论我把决心放在哪里。有谁知道我怎么能做到这一点？：/

app.js代码段

var wizardResolve = {
    assetLoader: ['$q', '$interval', function($q, $interval) {
        var defer = $q.defer();
        var interval = $interval(function() {
            if (apiAsset1 !== undefined && apiAsset2 !== undefined) {
                assetsLoaded = true;
                console.log(assetsLoaded);
                $interval.cancel(interval);
                defer.resolve();
            }
            console.log('spinning');
        }, 100);
    return defer.promise;
    }] 
};

//

app.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', '$httpProvider', function($stateProvider, $urlRouterProvider, $locationProvider, $httpProvider) {
    $urlRouterProvider.otherwise('/');
    $stateProvider
        .state('wizard', {
            views: {
                '': {
                    templateUrl: 'components/wizard/wizard.html',
                },
                'main@wizard': {
                    templateUrl:     'components/wizard/base/core/main/main.html',
                    resolve: wizardResolve
                }
            }
        });
    $locationProvider.html5Mode(true);
}]);

// various api calls & callbacks...

multivariate-tests.directive.js片段

angular.module('app.directives.mvTests', []).directive('mvTests', ['$rootScope','$window', '$location', '$state', function($rootScope,    $window, $location, $state) {
    return {
        restrict: 'A',
        controller: function($scope) {
            $scope.view = 'wizard';  // forced view
            $state.go($scope.view);

            // -- Dynamic Paths ---------------
            $scope.headerPath = 'components/'+$scope.view+'/base/header/header.html';
            $scope.basePath = 'components/'+$scope.view+'/'+$scope.view+'.html';
            $scope.preFooterPath = 'components/'+$scope.view+'/base/pre-footer/pre-footer.html';
            $scope.footerPath = 'components/'+$scope.view+'/base/footer/footer.html';
    };
}]);

的index.html

<!doctype html>
<html data-ng-app="myApp" data-ng-controller="appCtrl" data-ngd-mv-tests>
<head> ... </head>
<body class="{{view}}">
    <div class="base" ui-view=""></div>
</body>
</html>

wizard.html

<header role="banner" data-ng-include="headerPath"></header>
<main role="main" ui-view="main"></main>
<section class="pre-footer" data-ng-include="preFooterPath"></section>
<footer role="contentinfo" data-ng-include="footerPath"></footer>

Angular / UI-Router - 如何推迟嵌套视图的加载，而不是其父视图的加载？

0 个答案: