Доступ к следующим и предыдущим элементам в ng-repeat с помощью angularFire

Я составляю список элементов, используя ng-repeat и angularFire, мне нужно получить доступ к следующим и предыдущим элементам в каждом списке.

TLDR;

Этот фрагмент кода {{products[$index - 1].name}} не работает с объектом, возвращаемым angularFire

Изменить:

Я использую orderByPriority для преобразования объекта в такой массив ng-repeat='product in products | orderByPriority | startFrom:startFrom() | limitTo:pageSize'


Мой список продуктов выглядит так

{
  "-JBfPahaB9FomJej6cyu" : {
    "price" : 400,
    "brand" : "Formica",
    "name" : "Wengue Tabaco",
    "code" : "0406",
    "img" : "0406.jpg"
  },
  "-JBfP0fPcjQi_pAd2mp0" : {
    "price" : 400,
    "brand" : "Formica",
    "name" : "Zebra",
    "code" : "0402",
    "img" : "0402.jpg"
  },
  "-JBfUWmLqWDNH7X0XW09" : {
    "price" : 400,
    "brand" : "Formica",
    "name" : "Perillo Mediterraneo",
    "code" : "0409",
    "img" : "1320.jpg"
  },
  "-JBfUySzDEv32FkSr62t" : {
    "price" : 400,
    "brand" : "Formica",
    "name" : "Peral",
    "code" : "0410",
    "img" : "0410.jpg"
  },
  "-JBfRTaShz2GNAjY9Fd2" : {
    "price" : 400,
    "brand" : "Formica",
    "name" : "Balsa Hindú",
    "code" : "0412",
    "img" : "0412.jpg"
  },

}

Я использую такой код, как этот, который работает с простым массивом javascript.

<div ng-app="test-app" ng-controller="MyController">
    <ul id="contents">
      <li ng-repeat='product in products | orderByPriority | startFrom:startFrom() | limitTo:pageSize'>
          <div class="title">{{$index}} - {{product.name}} </div>
          <div>Prev: {{products[$index - 1].name}}</div>
          <div>Next: {{products[$index + 1].name}}</div>
      </li>
    </ul>
</div>

Но попытка использовать похожий код с объектом, возвращаемым angularFire, не работает.

Кроме того, первый элемент должен иметь ссылку на последний, а последний элемент на первый.

Я пытаюсь сделать какую-то карусель, когда, если вы нажмете «Предыдущий» в первом элементе, он перейдет к последнему элементу, а когда вы нажмете «Далее» в последнем элементе, он перейдет к первому.


person Cesar    schedule 26.03.2014    source источник
comment
Ваша вторая скрипка (похожий код) использует angularFire 0.3; ему больше года и 5 релизов позади.   -  person Kato    schedule 28.03.2014
comment
Вызов orderByPriority или toArray (ваши две скрипки используют разные версии angularFire с разными API) не преобразует объект products в массив. Насколько я знаю, это влияет на итерируемый объект/массив, к которому вы не можете получить доступ напрямую из области действия директивы.   -  person Kato    schedule 28.03.2014
comment
@Kato Знаете ли вы способ преобразовать объект продуктов в массив в контроллере?   -  person Cesar    schedule 02.04.2014
comment
Вы также можете использовать фильтр для этого:   -  person Kato    schedule 02.04.2014


Ответы (1)


В итоге я преобразовал объект Firebase в массив и использовал этот массив в ng-repeat.

В кофе:

    $scope.myProducts = []

    $scope.products.$on 'loaded', ->
        $scope.keys = $scope.products.$getIndex()

        for j in $scope.keys
            $scope.myProducts.push $scope.products[j]

и используя:

    data-target="#producto-{{myProducts[$index-1].code || myProducts[myProducts.length-1].code}}"
    data-target="#producto-{{myProducts[$index+1].code || myProducts[0].code}}"

для следующей/предыдущей функциональности

@Kato, спасибо, что указали на проблемы с версиями!

person Cesar    schedule 02.04.2014