Как показать индикатор загрузки при загрузке приложения в первый раз

Мне нужно загрузить много файлов для моего приложения AngularJs на одной странице, например angular.js, jquery.Яш, ушко.Яш, ушко.css, some_plugins.js, my_main.js и другие,

требуется некоторое время для загрузки всего приложения, поэтому я хочу показать индикатор загрузки (например, счетчик) на странице void, пока все файлы JS и css не загрузятся, а затем отобразят содержимое.

11
angularjs css javascript jquery twitter-bootstrap

2 ответов

для угловых приложений используйте Угловая Панель Загрузки. Похоже на этой.

  • будет применяться всякий раз, когда запрос XHR выходит в angular
  • можно указать, что запрос не отображать значок загрузки
  • отображается только тогда, когда запрос заставляет пользователя ждать
  • можно стилизовать по своему вкусу
  • вводится в модуль услуг и просто работает
26

я использовал ПАСЕ.js раньше на устаревшем проекте, написанном почти полностью в магистрали.js, в котором ожидание разрешения всех зависимостей было довольно болезненным.

это почти не конфигурация для начала работы, поэтому, если вы ищете относительно простую библиотеку, я бы использовал ее.

изменить:

документы:

включить темпами.js и тема css по вашему выбору на Вашей странице (как можно раньше), и ты молодец!

Pace автоматически отслеживает ваши запросы ajax, задержку цикла событий, состояние готовности документа и элементы на Вашей странице, чтобы решить ход выполнения. На ajax навигация начнется снова!

Если вы используете AMD или Browserify, требуйте в темпе.JS и называют ПАСЕ.start () как можно раньше в процессе загрузки.

пример

<head>
  <script src="/pace/pace.js"></script>
  <link href="/pace/themes/pace-theme-barber-shop.css" rel="stylesheet" />
</head>
14