angularjs + фундамент орбіти - angularjs, zurb-foundation

Привіт Я хочу, щоб заповнити вміст для орбіти слайдера Foundation динамічно з використанням кутового типу:

<div class="moreGamesArea">
<ul class="orbit" data-orbit>
<li ng-repeat="games in catalogGames">
<div>{{games[0]}}</div>
</li>
</ul>
</div>

Але це не ініціалізує повзунок правильно. У dom-model я бачу 3 елементи <li> як це повинно бути - так кутові роботи нормально, але слайдер - має лише один слайд! що не так? Дякую

Відповіді:

Спочатку. Вам потрібно створити директиву.

.directive("afterRenderRepeat", function() {
return function(scope, element, attrs) {
if (scope.$last){
$(document).foundation();
}
};
})

Другий. Назовите це в розділі ng-repeat.

<div class="moreGamesArea">
<ul class="orbit" data-orbit>
<li ng-repeat="games in catalogGames" data-after-render-repeat>
<div>{{games[0]}}</div>
</li>
</ul>
</div>

Директива допомогла мені звільнити фонд 5.

у фонді 6 для ініціалізації використання орбіти:

Foundation.reInit ("орбіта");

.directive("initOrbit", function(){
return function(scope) {
if (scope.$last){             //  when  ng-repeat finish to load all elements
Foundation.reInit("orbit");   // reinit orbit
}
};
})

<ul class="orbit-container">
<li class="orbit-slide" ng-repeat="slide in slides" init-orbit>

більше: https://foundation.zurb.com/sites/docs/javascript.html#initializing