AngularJS: ngIf в массиве объектов с разными свойствами

0

У меня есть проблема с директивой ngIf. Я попробовал много способов решить эту проблему, но, к сожалению, не удалось.

У меня есть массив объектов с разными свойствами. Что-то вроде этого:

    object = [
    {
        name: "1",
        isNumber: true,
    },
    {
        name: "2",
        isNumber: true,
    },
    {
        name: "3",
        isNumber: true,
    },
    {
        name: "4",
        isNumber: true,
    },
    {
        name: "5",
        isNumber: true,
    },
    {
        name: "#",
        isNumber: false,
    },
    {
        name: "*",
        isNumber: false,
    }

Мне нужно использовать ngIf для последнего объекта с истинным значением свойства isNumber. Я не знаю, сколько объектов с isNumber в true будет в моем массиве. Это может быть 7 или 82. Никто не знает. Также объекты с isNumber на false не всегда будут в моем массиве. Иногда массив будет иметь только объекты с isNumber на true и без объектов с isNumber на false.

Как я могу достичь этого, используя ngIf?

Заранее спасибо.

ОБНОВИТЬ:

У меня есть что-то вроде этого:

1, 2, 3, 4, 5, 6, 7, *, #.

И я не хочу иметь кнопку "Вниз" на последнем элементе с истинным значением свойства isNumber (в этом случае 7). Потому что, если пользователь переместит его, у меня будет следующее:

1, 2, 3, 4, 5, 6, *, 7, #.

И это будет неправильная логика.

Итак, мне нужно использовать ngIf, чтобы я мог отключить эту кнопку на этом элементе. Но иногда я могу иметь что-то вроде этого (без лишних символов):

1, 2, 3, 4, 5.

И в этой ситуации мне также не нужна кнопка "Вниз" на последнем элементе. Потому что невозможно переместить последний элемент вниз.

  • 0
    Не совсем уверен, что вы спрашиваете. Вы хотите, чтобы ng-if проверил, является ли isNumber истинным ИЛИ, если это последний элемент? Можете ли вы дать больше кода, а также ожидаемый результат?
  • 0
    Я хочу проверить, является ли isNumber истинным И в то же время он должен быть последним элементом.
Теги:
angular-ng-if

2 ответа

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

Если вы пытаетесь найти, если это последний элемент И, если isNumber установлен в true, вы можете использовать это:

<span ng-repeat="item in items" ng-if="item.isNumber && $last">

$last - специальная переменная, определенная через ngRepeat, расположенную здесь. Поскольку ngIf принимает логический оператор, вы можете использовать как логические && и || операторы.

Изменить: если вы не выполняете итерацию по ней с помощью ngRepeat и вы просто хотите выбрать последний элемент, вы можете сделать что-то подобное, чтобы выбрать последнее, а затем использовать ngIf для его отображения, если isNumber установлено в true:

<span ng-bind="list[list.length - 1]" ng-if="list.isNumber">

Редактировать 2: Не могли бы вы "заглянуть" в следующий элемент и посмотреть, установлено ли следующее значение isNumber false? Как это:

<span ng-repeat="...">
   <span ng-if="!list[$index + 1].isNumber"></span>
</span>

Как и $last, я использую специальную переменную $index для перехода к следующему элементу ngRepeat. (не уверен, что Angular автоматически проверяет ошибки вне очереди или если он выдает ошибку)

Поделиться
  • 0
    Является ли OP ng-repeat -ing над массивом?
  • 0
    Хм. Я предполагаю, что просто предположил, что OP перебирает массив.
Показать ещё 6 комментариев
1

Ваш первоначальный вопрос был немного запутанным, но благодаря изменениям, я думаю, я понимаю, что вам нужно. Используя $index в сочетании с $last, вы можете добиться того, что хотите сделать простым способом:

<div ng-repeat="item in items">
    {{item.name}}
    <button ng-if="!$last && items[$index + 1].isNumber">Down</button>
</div>

объяснение

Условие отображения кнопки "Вниз": !$last && items[$index + 1].isNumber. Действительно, мы должны показать кнопку, если:

  • текущий элемент не последний !$last

  • следующий - номер: items[$index + 1].isNumber

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

Смотрите демонстрационную скрипку

Поделиться

Ещё вопросы

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