Угловой http получить от ng-click

Question

У меня довольно сложная ситуация, когда я вызываю данные из API, которые потенциально имеют сотни или даже тысячи результатов. Он включает в себя варианты разбивки на страницы, которые я могу вызвать.

Мне нужно разбить список результатов на страницы, используя данные API.

Страница изначально загружена $scope.displayData = function (url, page, limit) и вызвана с $scope.displayData("linktomydata?", 1, 20);, которая возвращает что-то вроде linktomydata?page=1&limit=20 из моего контроллера. Это отображает записи для данных в порядке.

Однако у меня есть директива, чтобы получить общее количество возможных страниц на основе лимита в 20 на страницу, и я использую простой цикл для создания списка ссылок под данными, которые служат для разбивки на страницы. Затем для каждой ссылки назначается функция displayData с соответствующими параметрами.

app.directive ('paginationList', function($timeout) { 
    return { 
     // Set as a replaceable element 
     restrict: 'E', 
     link: function(scope, element) { 
      $timeout(function() { 
       scope.$watch('pagination', function(pagination) { 
        if(pagination) { 
         for (var i = 1; i < scope.pagination.pages + 1; i++) { 
          element.append('<a href ng-click="displayData("linktomydata?", 6, 20)"></li>' + i + '</li></a>'); 
         }; 
        } 
       }); 
      }) 
     } 
    } 
}); 

Это должно отображаться на странице 6 имеющихся данных и по-прежнему ограничивают до 20. Однако отображаемые данные не прослеживается, если ссылка пагинация щелкают и ничего не возвращается. никаких ошибок консоли.

Я перепутал свои области или что-то еще? Или я просто собираюсь все это неправильно?

Любая помощь будет высоко оценена.

Answer 1

Да, вы немного смешиваете разные вещи. Это будет выглядеть намного лучше, таким образом:

app.directive ('paginationList', function($timeout) { 
return { 
    replace: true 
    restrict: 'E', 
    templateUrl: 'view/paginationList.html', 
    link: function(scope, element) { 
     var linkToMyData = 'linktomydata?'; 

     //using underscore's range method is the easiest way 
     $scope.range = _.range; 

     scope.displayData = function(page, limit){ 
      //do the magic here 
     } 
    } 
} 

});

шаблон:

<div> 
    <li ng-repeat="page in range(1,pagination.pages)"> 
     <a href ng-click="displayData(page, 20)"> 
    </li> 
</div> 

использование:

<pagination-list></pagination-list>