повторять предметы в фиксированных позициях

0

У меня есть директива ng-repeat, и я хочу показать разные значения объектов в фиксированных позициях индекса.

данные:

{
    "recipe": {
    "id":"0001",
    "name":"soup",
    "cat":[{"name":"dinner"}, {"name":"lunch"}, {"name":"breakfast"}]
}

Я хочу, чтобы это было похоже...

нг-повторить:

1: (показать cat.name: "завтрак") следует показывать только по индексу 0

2: (не показывать предметы, содержащие "завтрак", "ужин")

3: (не показывать предметы, содержащие "завтрак") (показать cat.name: "ужин") - показывать только "ужин" по индексу места 3

4: (не показывать предметы, содержащие "завтрак", "ужин")

5: (не показывать предметы, содержащие "завтрак", "ужин")

и т.д..

Как мне это сделать?

  • 0
    написать собственный фильтр.
Теги:
angularjs-ng-repeat

2 ответа

0
Лучший ответ

orderBy фильтр достигнет этого, но вам нужно помочь.

Я бы дал каждому элементу cat displayOrder, поскольку ему что-то нужно.

Тогда просто

<ul>
    <li ng-repeat="x in data.recipe.cat | orderBy:orderMeals">
        {{x.name}}
    </li>
</ul>

С контроллером, делающим что-то вроде

var app = angular.module('myapp', []);
app.controller('myCtrl', function($scope, $timeout) {
      $scope.data = {
        "recipe": {
          "id": "0001",
          "name": "soup",
          "cat": [{
            "name": "dinner", displayOrder: 2
          }, {
            "name": "lunch", displayOrder: 1
          }, {
            "name": "breakfast", displayOrder: 0
          }]
        }};

        $scope.orderMeals = function(item) {
          console.log('item', item);
          return item.displayOrder;
        }

});

Заметьте, я добавил displayOrders в ваш объект рецепта (см. Здесь)

0

попробуй это

<script>
 var app = angular.module('myApp', []);
    app.controller('myCtrl', ['$scope', function($scope) {

     $scope.json = {
      "recipe": {
      "id":"0001",
      "name":"soup",
      "cat":[{"name":"dinner"}, {"name":"lunch"}, {"name":"breakfast"}]
      }
     };
     $scope.json.recipe.cat.reverse();
    }]);

.html

 <body ng-app='myApp' ng-controller='myCtrl'>
<div ng-repeat ="t in json.recipe.cat" ng-if="t.name != 'breakfast' && t.name != 'dinner'">
 here : {{t.name}}
</div>

см. код plunker здесь

Ещё вопросы

Сообщество Overcoder
Наверх
Меню