2017-02-22 20 views
0

Я работаю с ui-scroll от angular-ui (отличная работа, компонент потрясающий!).буферное пространство ui-scroll в верхней части окна просмотра

Все работает хорошо по большей части. Данные загружаются из пользовательского источника данных при прокрутке вниз. Однако, когда я перехожу назад, я получаю много пробелов в окне просмотра.

При осмотре похоже, что ui-scroll добавляет суб-div и динамически устанавливает высоту, но по какой-то причине это не возвращается к 0 при прокрутке вверху окна просмотра.

Я предполагаю, что это связано с тем, как мой источник данных служит для передачи данных. Я также не обворачиваю отрицательную индексацию. Может ли кто-нибудь объяснить, как я должен учитывать отрицательный индекс в функции datasource.get(), когда я сопоставляю стандартную службу разбивки на страницы (индекс + смещение и т. Д.)?

ответ

0

Хорошо, я думаю, что нашел решение ... Надеюсь, это поможет кому-то другому, потому что я действительно не смог найти рабочий пример в демонстрационных версиях, предоставляемых командой углового ui.

По существу, когда вы получаете отрицательный индекс, вам необходимо: 1) закрепить индекс до 0, а затем настроить переменную count на разницу.

Вот некоторые примеры кода:

dataSource.get = function (index, count, successCallback) 
    { 
     // Index provided is 1-based, we'll convert to 0-based and clamp at 0 
     var realIndex = Math.max(1, index) - 1; 

     if (index < 0) { 
      count -= 1 - index; 
     } 

     if (realIndex < 0 || 
      count == 0 || 
      realIndex >= vm.searchResultCount) 
     { 
      successCallback([]); 
      return; 
     } 

     ... 
     Make a pagination call to a service that expects the first 
     page of results to be at index 0. 
0

Ui улиткой реализация DataSource в случае ограниченного массива данных может выглядеть следующим образом

var min = 1, max = 100; 
dataSource.get = function(index, count, success) { 
    var start = Math.max(min, index); 
    var end = Math.min(index + count - 1, max); 
    if (start <= end) { 
     getDataAsync(start, start + end + 1).then(success); 
    } 
    else { 
     success([]); 
    } 
}; 

Это позволяет работать с массивами данных, начиная с min индекса , Также вы можете легко удалить ограничение на дне через var end = index + count - 1.

Но я также хотел бы сказать, что это может быть ответственность на заднем плане. Посмотрите на этот образец: https://rawgit.com/angular-ui/ui-scroll/master/demo/append/append.html - массив данных ограничен от 1 до 50, в то время как источник данных (пропуски) составляет всего

get: function (index, count, success) { 
    Server.request(index, count).then(success); 
}