即使没有使用angular2的对话，如何显示已关闭的消息部分

我有两个标签

我有“活动消息”选项卡，它工作正常。 我有关闭的消息选项卡，如果我在关闭的消息选项卡中没有消息，则会出现错误，该错误是因为我在前端循环。 那么，谁能帮我解决这个问题。。 即使我在关闭的选项卡中没有对话，它也必须显示空字段，如果我更改了选项卡，它也必须正常工作

HTML:

---

你可以使用ngIf

    <ul>
       <li *ngIf="message_close == undefined || message_close.messages.length == 0|| message_close.messages.length == undefined">
          <p>there is no closed messages.</p>
         </li>

        <li *ngFor="let reply of message_close.messages" >
          <img [src]="reply.from_user_image || '../assets/images/msg.png'"/>
          <p><b>{{reply.name}} </b> <span> {{reply.updated_at | date:'dd.MM.yyyy'}} - {{reply.updated_at | date:'h:mm'}}</span></p>
          <p>{{reply.text}}</p>
        </li>

      </ul>

---

谢谢你的回复，但是我没有按照我的要求得到你的要求是什么？我使用ngIfin close message（关闭消息）选项卡向您展示实现目标的方法，我有空对话。。所以它一定是空的。。选项卡也必须工作如果你像我说的那样尝试会发生什么？现在，我得到了这个错误，错误类型错误：无法读取未定义的属性“messages”

loadMessages() {
    this.service
          .getMessages()
          .subscribe(
            data => {
              this.messagesdata = data;
              this.activeMessages = data.filter(msg => msg.active == true && msg.from_user_name !== 'Anonymus' && msg.messages.length > 0)
              this.closedMessages = data.filter(msg => msg.active == false && msg.from_user_name !== 'Anonymus' && msg.messages.length > 0);
              if (this.closedMessages.length > 0) {
                if(!this.message_close) {
                  var test2 = this.message_close = this.closedMessages[0];
                  this.message_idc = this.closedMessages[0].id;
                  this.message_close.messages.map(function(msg) {
                    if(msg.from_user_id == test2.from_user_id) {
                      msg.from_user_image = test2.from_user_image;
                    } else {
                      msg.from_user_image = test2.to_user_image;
                    }
                    if(msg.to_user_id == test2.to_user_id) {
                      msg.to_user_image = test2.to_user_image;
                    } else {
                      msg.to_user_image = test2.to_user_image;
                    }
                  })
                }
              }              
            },error => {});
  }

    <ul>
       <li *ngIf="message_close == undefined || message_close.messages.length == 0|| message_close.messages.length == undefined">
          <p>there is no closed messages.</p>
         </li>

        <li *ngFor="let reply of message_close.messages" >
          <img [src]="reply.from_user_image || '../assets/images/msg.png'"/>
          <p><b>{{reply.name}} </b> <span> {{reply.updated_at | date:'dd.MM.yyyy'}} - {{reply.updated_at | date:'h:mm'}}</span></p>
          <p>{{reply.text}}</p>
        </li>

      </ul>