Angular, как показать предупреждение, если элементы не отображаются?

avatar
Khaled Ramadan
8 апреля 2018 в 10:08
269
2
1

Я пытаюсь отобразить сообщение типа "Элемент не существует", когда этот элемент не существует.

Допустим, это мой список:

user 0
user 1
user 2

и текущий код показывает список выше:

<ng-container *ngFor="let user of users | async; let i = index">
  <div *ngIf="!user.deleted">
    {{user.name}} {{i}}
  </div>
</ng-container>

Теперь предположим, что все пользователи были удалены (user.deleted = true) Но массив пользователей все еще существует и имеет ту же длину 3.

Итак, как я могу показать сообщение о том, что здесь нет ни одного пользователя?

Примечание: приведенный выше список является списком в реальном времени (fireabse)

Спасибо.

Источник

Ответы (2)

avatar
Jörg Reichardt
8 апреля 2018 в 10:56
1

Вы создаете список пользователей (с тремя записями), а затем скрываете содержимое. Что вам нужно сделать, так это отфильтровать список пользователей напрямую. Это можно сделать в коде компонента, где вы извлекаете пользователей. Может быть, вы даже можете позволить firebase выполнять фильтрацию. После цикла for вы можете добавить *ngIf, который проверяет список на нулевую длину и показывает сообщение «Нет записей».

avatar
bugs
8 апреля 2018 в 10:14
1

Вы можете использовать this.users.every(user => user.deleted), чтобы проверить, не был ли удален хотя бы один пользователь.

Исходя из этого условия, вы можете показать/скрыть другой элемент div в своем html.

Рабочая демонстрация