Как скрыть данные, поступающие из бэкэнда, когда условия являются анонимными, а массив внутри массива пуст в angular2

Question

У меня есть массив данных, поступающих из бэкэнда, и мое требование следующее:

1. Я должен скрыть содержимое, если имя пользователя "from_user_name" равно Anonymus.
2. если сообщения внутри массива пустые.

Так может кто-нибудь помочь мне решить эти 2 условия.

HTML:

<ul>
    <li *ngFor="let message of activeMessages" (click)="showMessage(message)" [class.activeShow]="message.id == message_id">
      <span>{{message.updated_at  | date:'dd.MM.yyyy'}}</span>
      <img style="width: 40px;" [src]="message.from_user_image || '../assets/images/msg.png'"/>
      <p style="padding-top: 16px;display: inline;">{{message.from_user_name}}</p>
      <p style="padding-top: 10px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;"><b>{{message.text}}</b></p>
    </li>
  </ul>

TS:

loadMessages() {
    this.service
          .getMessages()
          .subscribe(
            data => {
              this.messagesdata = data;
              this.activeMessages = data.filter(msg => msg.active == true);
              this.closedMessages = data.filter(msg => msg.active == false);
              if (this.activeMessages.length > 0) {
                if(!this.message_show) {
                  var test = this.message_show = this.activeMessages[0];
                  this.message = true;
                  this.message_id = this.activeMessages[0].id;
                }
                console.log(this.activeMessages);
              }              
            },error => {});
  }

Консоль:

Answer 1

этот тип поведения должен быть отфильтрован из бэкэнда, но в другом случае это правильный код:

loadMessages() {
    this.service
      .getMessages()
      .subscribe(
        data => this.activeMessages = data.filter(msg => msg.active && msg.from_user_name !== 'Anonymus' && msg.messages.length > 0)
}