Question

我希望在运行实际路径代码之前触发route.resolve方法。不幸的是，在下面的代码中，prime（）被调用，但是它被异步调用，并且在素数完成之前调用路由代码。我认为路由的解决方法是在加载路由之前完成的？

(function () {
'use strict';

var app = angular.module('app');

// Collect the routes
app.constant('routes', getRoutes());

// Configure the routes and route resolvers
app.config(['$routeProvider', 'routes', routeConfigurator]);
function routeConfigurator($routeProvider, routes) {

    routes.forEach(function (r) {
        setRoute(r.url, r.config)

    });

    $routeProvider.otherwise({ redirectTo: '/' });

    function setRoute(url, definition) {
        //set resolvers for all of the routes
        //by extending any existing resolvers (or creating a new one)
        definition.resolve = angular.extend(definition.resolve || {}, {
             prime: prime
        });


        $routeProvider.when(url, definition);
        return $routeProvider;
    }


}

prime.$inject = ['datacontext'];

function prime(dc) {
    dc.prime();
}


// Define the routes 
function getRoutes() {
    return [
        {
            url: '/',
            config: {
                templateUrl: 'app/dashboard/dashboard.html',
                title: 'dashboard',
                settings: {
                    nav: 1,
                    content: '<i class="icon-dashboard"></i> Dashboard'
                }
            }
        },
        {
            url: '/sessions',
            config: {
                title: 'admin',
                templateUrl: 'app/sessions/sessions.html',
                settings: {
                    nav: 2,
                    content: '<i class="icon-calendar"></i> Sessions'
                }
            }
        },
        {
            url: '/speakers',
            config: {
                title: 'speakers',
                templateUrl: 'app/speakers/speakers.html',
                settings: {
                    nav: 3,
                    content: '<i class="icon-user"></i> Speakers'
                }
            }
        },
        {
            url: '/attendees',
            config: {
                title: 'attendees',
                templateUrl: 'app/attendees/attendees.html',
                settings: {
                    nav: 4,
                    content: '<i class="icon-group"></i> Attendees'
                }
            }
        }
    ];
}
})();

Answer 1

尝试将素数更改为以下内容：

function prime(dc) {
    return dc.prime();
}

Answer 2

我建议你将prime函数重新定位到全局控制器，将其定义为：

$scope.prime = function (dc) {
    dc.prime();
};

Answer 3

在routeConfigurator范围内移动素数

 (function () {
        'use strict';

    var app = angular.module('app');

    // Collect the routes
    app.constant('routes', getRoutes());

    // Configure the routes and route resolvers
    app.config(['$routeProvider', 'routes', routeConfigurator]);

    function routeConfigurator($routeProvider, routes) {
        routes.forEach(function (r) {
            setRoute(r.url, r.config);
        });
        $routeProvider.otherwise({ redirectTo: '/' });
        function setRoute(url, definition) {
            definition.resolve = angular.extend(definition.resolve || {}, { prime: prime });
            $routeProvider.when(url, definition);
            return $routeProvider;
        }
        prime.$inject = ['datacontext'];
        function prime(datacontext) {
            return datacontext.prime();
        }
    }


    // Define the routes 
    function getRoutes() {
        return [
            {
                url: '/',
                config: {
                    templateUrl: 'app/dashboard/dashboard.html',
                    title: 'dashboard',
                    settings: {
                        nav: 1,
                        content: '<i class="fa fa-dashboard"></i> Dashboard'
                    }
                }
            },
            {
                url: '/sessions',
                config: {
                    title: 'sessions',
                    templateUrl: 'app/sessions/sessions.html',
                    settings: {
                        nav: 2,
                        content: '<i class="fa fa-calendar"></i> Sessions'
                    }
                }
            },
            {
                url: '/speakers',
                config: {
                    title: 'speakers',
                    templateUrl: 'app/speakers/speakers.html',
                    settings: {
                        nav: 3,
                        content: '<i class="fa fa-user"></i> Speakers'
                    }
                }
            },
            {
                url: '/attendees',
                config: {
                    title: 'attendees',
                    templateUrl: 'app/attendees/attendees.html',
                    settings: {
                        nav: 4,
                        content: '<i class="fa fa-group"></i> Attendees'
                    }
                }
            }
        ];
    }
})();

angularjs $ routeProvider路由在resolve完成之前执行

3 个答案: