Angularjs ng-repeat рендерит больше элементов, чем в массиве - PullRequest
0 голосов
/ 12 июня 2018

В настоящее время у меня есть следующий код:

    <div class="carousel" ng-if="novedadesEmpleados.cumpleanosDeHoy.length">
            <div ng-repeat="empleado in novedadesEmpleados.todaysBirthdays" carousel-renderer class="event-card">

                <birthday-card empleado="empleado" card-notifier></birthday-card>

            </div>
    </div>

Который работал нормально, пока я не переключился с использования Bootstrap Carousel на Tiny Slider .

В массиве в настоящее время есть 2 элемента, однако HTML отображает 6, 4 oh, которые просто показывают текст angularjs по умолчанию (имя свойств в фигурных скобках), а другие 2 отображают правильную информацию.

Что может быть причиной этого?Две директивы используются для вызова инициализатора Tiny Slider после завершения рендеринга:

angular.module('PortalIntranet').directive('cardNotifier', function ($timeout) {
    return function(scope, element, attrs){
        if(scope.$last)
            scope.$emit('FinishedRendering'); 
    }
});

angular.module('PortalIntranet').directive('carouselRenderer', function ($timeout) {
    return function (scope, element, attrs) {
        scope.$on('FinishedRendering', function (event) {
            var slider = tns({
                container: '.card-slider',
                autoplay: true,
                slideBy: 'page',
                autoplayTimeout: 3500,
                speed: 750,
                autoplayButton: false,
                nav: false,
                autoplayButtonOutput: false,
                controls: false
            });
            console.log(slider);
        });
    }
});

1 Ответ

0 голосов
/ 12 июня 2018

Angular, скорее всего, не отображает больше элементов, чем в массиве.Во-первых, убедитесь, что ваши данные чисты.

Я считаю, что корень;) вашей проблемы находится в директивах и rootScope.Скорее всего, вам нужна проверка, когда условие выполняется в rootScope или области действия «carouselRenderer», а не в области действия «cardNotifier».т.е.

if (scope.$parent.$last) 

Вы хотите последний из повторяющихся элементов в родительской области.

Также, в качестве примечания, убедитесь, что ваши классы CSS находятся в нужном месте.Почему «карточка событий» на карусели-рендерере, а не на дне рождения?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...