Как сделать индикатор загрузки всего приложения с помощью angularjs?

Question

[hobu4ok91]

Нужно сделать чтобы отображался только индикатор, пока не загрузятся определенные скрипты и не придут все ответы с сервера

Answer 1

[Олег]

Angular Loading Bar
Искал для своего проекта похожее, и остановился на этом. Показывает полоску с прогресс-баром наверху страницы (как мобильные браузеры или Тостер)

Если обязательно скрыть какие-то элементы - используйте ng-hide, здесь подробнее: www.code-hound.com/add-a-preloader-to-your-website...

Можно использовать в контроллере ангуляровский аналог

angular.element(document).ready(function () { $scope.isReady = true }

Однако в доках написано, что все контроллеры в любом случае инициализируются уже после DOMContentLoaded: https://docs.angularjs.org/guide/bootstrap так что можно попробовать сразу прописать в контроллере $scope.isReady = true

и повесить на блок с прелоадером директиву ng-hide=isReady, которая сработает сразу после инициализации контроллера.

Comments

[hobu4ok91]

а как вы думаете, можно создать сервис в котором обращаться к обработчику - document.addEventListener("DOMContentLoaded", ready), который говорит что все дом элементы созданы; и все нужные скрипты записать в head и когда сервис будет возвращать true тогда показывать страницу. А до этого показывать прелоадер?

Answer 2

[Александр Аксентьев]

Нормального решения в принципе нет под такое. Потому что файлы новые постоянно появляются и подгружаются динамически.
Не нормальное - список файлов, колбек при загрузке каждого и ручное отслеживание и подсчет %.

https://toster.ru/answer?answer_id=806202#answers_...