Показать сообщение отдельно
  #1 (permalink)  
Старый 18.07.2014, 17:28
Аватар для Sufir
Аспирант
Отправить личное сообщение для Sufir Посмотреть профиль Найти все сообщения от Sufir
 
Регистрация: 15.06.2008
Сообщений: 47

Несколько экземпляров директивы с различными параметрами
Взялся за изучение ангуляра. Вывожу на странице несколько списков, к каждому из них хочу сделать пагинацию. Набросал директиву, для одного списка всё получилось, всё работает. Но если попытаться ею воспользоваться для нескольких списков в одном контроллере - всегда работает с последним. Есть мысль попробовать сделать как-нибудь при помощи new Paginator('list'), но вообще хочу узнать каким образом правильно использовать несколько раз директивы?

http://jsfiddle.net/QV7u5/28/

<!-- items list 1 -->
<paginator cur-list="list1"></paginator>

<!-- items list 2 -->
<paginator cur-list="list2"></paginator>


.directive('paginator', function() {
            return {
                link: function($scope, element, attrs) {
                    var listName = attrs['curList'];
                    var pages = $scope.paginator.pages[listName];

                    console.log(listName); // вот тут всегда имеем имя последнего списка

                    // ...

                    $scope.setPage = function(page) {
                       console.log(listName); // вот тут всегда имеем имя последнего списка
                       // ...
                    };

                },
                restrict: 'E',
                templateUrl: 'paginator.html'
            };
});


<div class="pagenav">

    <div class="npwrap">
        <span class="prev" ng-click="setPage(activePage-1)" title="Предыдущая">&lt;</span>
    </div>

    <div class="pages">

        <span
                ng-repeat="pageNum in pagesList"
                ng-click="setPage(pageNum)"
                ng-class="(activePage === pageNum) ? 'page-active' : ''">
            {{pageNum}}
        </span>

    </div>

    <div class="npwrap">
        <span class="next" ng-click="setPage(activePage+1)" title="Следующая">&gt;</span>
    </div>

</div>

Последний раз редактировалось Sufir, 18.07.2014 в 18:05.
Ответить с цитированием