Как дать понять что все элементы страницы загрузились?

Есть страничка которая загружается и полностью рендерится за 1 секунду. В это время у меня идёт запрос к базе в получение JSON данных, которые кладутся в scope ангуляра таким методом:

$http.get(path)
     .then(function (response) {
         $scope.currentProduct = response.data[0];
         $scope.allProducts = response.data.slice(1, response.data.length);
     });

Они подгружаются чуть чуть позже (допустим через 1 сек после того как загрузилась остальная страничка).

В этот момент страница уже полностью отрисована, только места где должны выводиться данные пока пустые. Код который выводит наши продукты:

<div class="col col-md-12">
    <ul class="bxslider">
        <li class="upcoming-item" ng-repeat="item in allProducts">
            <div class="panel panel-default">                                                         
                    <small ng-bind="item.Name"></small>
            </div>
        </li>
    </ul>
</div>

Мне нужно чтобы вывелись все продукты в список <li>, а потом я по эттому списку буду вызывать метод который создаст из списка красивый слайдер.

Проблема в том что у меня идёт такой порядок: страничка без ангуляра, инициализация слайдера (он видит что пусто и ничего не строит) и заполнение страницы ангуляровскими данными

Как мне отловить момент когда ВСЁ загрузилось на страницу. Методы типа window.load срабатывают когда рендерится страница, раньше того как приходят и отрисовываются данные с базы