Question

我遇到的问题是我的主页加载速度比AngularJS中的其他模板快。在加载所有模板之前，延迟加载主页的最佳方法是什么？基本上我遇到的问题是，在主页加载后，用户点击导航栏中的其他路线并且它不会转到该路线。然后经过一些更多的点击（比如延迟5秒），它会进入所需的路线（之后所有其他路线都会起作用）。

以下是$routeProvider方法调用：

角

App.config(function ($routeProvider) {

    $routeProvider
        .when('/', {
            templateUrl: home,
            controller: 'mainController',
            resolve: mainCont.resolve
        })
        .when('/gym', {
            templateUrl: gym,
            controller: 'gymController',
            resolve: gymCont.resolve
        })
        .when('/instructors', {
            templateUrl: instructors,
            controller: 'instructorsController',
            resolve: instructorCont.resolve
        })
        .when('/classes', {
            templateUrl: classes,
            controller: 'classesController',
            resolve: classCont.resolve
        })
        .when('/media', {
            templateUrl: media,
            controller: 'mediaController',
            resolve: mediaCont.resolve
        })
        .when('/shop', {
            templateUrl: shop,
            controller: 'shopController'
        })
        .when('/contact', {
            templateUrl: contact,
            controller: 'contactController',
            resolve: contactCont.resolve
        })
        .when('/admin', {
            templateUrl: admin,
            controller: 'adminController'
        });
 });

我试图在窗口完全加载之前放置一个覆盖整个屏幕的元素，但它并不适用于所有模板：

$(window).on('load', function() {
        $("#cover").hide();
    });

Answer 1

尝试使用RewriteRule ^(.*)/view/?$ http://google.com [NC,L]事件为您的加载符号或隐藏目的设置范围变量

$routeChangeSuccess

您可以为一个视图或所有视图执行此操作。并使用app.run(['$rootScope', function($root) { $root.$on('$routeChangeStart', function(e, curr, prev) { if (curr.$$route && curr.$$route.resolve) { // Show a loading message until promises aren't resolved $root.loadingView = true; } }); $root.$on('$routeChangeSuccess', function(e, curr, prev) { // Hide loading message $root.loadingView = false; }); }]);显示隐藏导航面板。

延迟加载主页直到加载所有模板

1 个答案: