Angularjs UI-утилит UI-прокрутки, как использовать

Я не совсем уверен, как использовать UI-прокрутки. Я создал плункер, но я не думаю, что он работает правильно, потому что он не добавляет и не удаляет элементы из DOM во время прокрутки. Он отображает их всех!

Мой Плункер для пользовательского интерфейса

 MyApp.controller('MyAppCtrl', function($scope) {
    $scope.myData = {
      get : function(index, count, success) {
    var result = [{"guid":"8544a1c7-d637-42ae-836a-8a71901b44ca"},{"guid":"aff1450c-b4dd-4aa0-9b12-ea097e72c6fa"},{"guid":"a1c68796-7a28-4721-904a-4944234e253e"},{"guid":"8b7d881f-20ea-4b6c-a8d6-772e1236e6bf"},{"guid":"398c50a7-885e-4455-b741-66ebc2a64060"},{"guid":"81557a60-60b5-425a-9839-cf1da7e21bde"},{"guid":"ed48be4e-5963-47a1-b872-2bf20bec5da3"},{"guid":"15d9fa95-f824-4bd9-8b75-afb8dec99f03"},{"guid":"eaf2e5aa-24a4-4995-82d5-e661efc64556"}];

      index = 1;
      count = 10;

        success(result);
      }
    };
});

Я посмотрел несколько примеров на Github, но большая часть кода написана на языке кофе и он только добавляет элементы в цикл в DOM. У меня вопрос, как вы можете добавлять элементы, если у вас уже есть данные правильно. У меня все еще есть перебор набора данных?

Ваша помощь очень ценится.

2 ответа

Решение

UI-Scroll оставляет за вами право на то, какой результат передать обратно в функцию обратного вызова success, основанную на индексе и числе. Как-то так должно работать

get: function(index, count, success){
        var result = [{"guid":"8544a1c7-d637-42ae-836a-8a71901b44ca"},{"guid":"aff1450c-b4dd-4aa0-9b12-ea097e72c6fa"},{"guid":"a1c68796-7a28-4721-904a-4944234e253e"},{"guid":"8b7d881f-20ea-4b6c-a8d6-772e1236e6bf"},{"guid":"398c50a7-885e-4455-b741-66ebc2a64060"},{"guid":"81557a60-60b5-425a-9839-cf1da7e21bde"},{"guid":"ed48be4e-5963-47a1-b872-2bf20bec5da3"},{"guid":"15d9fa95-f824-4bd9-8b75-afb8dec99f03"},{"guid":"eaf2e5aa-24a4-4995-82d5-e661efc64556"}];         
        success(result.slice(index-1, index-1 + count));
}

Помните, что переданный вами индекс не равен нулю, поэтому, когда вы работаете с массивом, вы должны использовать индекс, начинающийся с нуля (отсюда и индекс-1). Кроме того, вы можете захотеть оставить результат вне функции get, и ваша функция get вернет часть модели, которую вы хотите передать в UI-Scroll.

zach имеет смысл, однако для обработки не только четвертого, но и обратного индекса прокрутки, вы должны сделать это перед передачей индекса и рассчитывать на успех:

index = index <= 0 ? index + 1 : index -1;

IE, полученный код должен выглядеть так:

get: function(index, count, success) {
    var result = [
        {"guid":"8544a1c7-d637-42ae-836a-8a71901b44ca"},{"guid":"aff1450c-b4dd-4aa0-9b12-ea097e72c6fa"},
        {"guid":"a1c68796-7a28-4721-904a-4944234e253e"},{"guid":"8b7d881f-20ea-4b6c-a8d6-772e1236e6bf"},
        {"guid":"398c50a7-885e-4455-b741-66ebc2a64060"},{"guid":"81557a60-60b5-425a-9839-cf1da7e21bde"},
        {"guid":"ed48be4e-5963-47a1-b872-2bf20bec5da3"},{"guid":"15d9fa95-f824-4bd9-8b75-afb8dec99f03"},
        {"guid":"eaf2e5aa-24a4-4995-82d5-e661efc64556"}
    ];
    index = index <= 0 ? index + 1 : index -1;
    success(result.slice(index, index + count));
}
Другие вопросы по тегам