Задержка загрузки начальной страницы до загрузки всех шаблонов

Question

У меня возникает проблема, в которой моя домашняя страница загружается быстрее, чем другие шаблоны в AngularJS. Каким будет лучший способ отложить загрузку главной страницы до тех пор, пока не будет загружено ВСЕ шаблоны? По сути, проблема, с которой я сталкиваюсь, заключается в том, что после загрузки главной страницы пользователь нажимает другой маршрут на панели навигации и не переходит к этому маршруту. Затем после некоторого нажатия (например, 5 секундной задержки) он переходит на нужный маршрут (и после этого все остальные работают).

Вот $routeProvider вызов метода:

ANGULAR

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

попробуйте использовать $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; 
    }); 
}]); 

Вы можете сделать это для одного вида или всех видов в целом. и используйте ng-show="loadingView", чтобы показать скрытую панель навигации.