Первый объект Angular 7 не помещается должным образом в массив

Question

У меня есть приложение чата.Я устанавливаю новое соединение и затем отправляю им сообщение: hello, человек, которому я отправляю это сообщение, получает сообщение и показывает его на экране мобильного телефона.На моем телефоне, однако, он не отображается на моем экране, и внутри наблюдаемой подписки все, что проходит, это [].Затем, когда я закрываю окно, с которым разговариваю с партнером, и снова открываю его, все сообщения, которые были отправлены ранее, отображаются на моем экране, а затем отправка дополнительных сообщений дает желаемый эффект.

component.ts

public messages$: Message[] - [];
private _messages: Subscription;

  public ngOnInit(): void {
    this._messages = this.chatService.messages$().subscribe((message: Message[]): void => {
      console.log('message received in subscription', message);
      this.messages$ = message;
      this.scrollToBottom();
    });
  }

  private ngOnDestroy(): void {
    this._messages.unsubscribe();
  }

chat.service.ts

 private messages: Message[] = new Array<Message>();
  private readonly bsMessages$: BehaviorSubject<Message[]> = new BehaviorSubject<Message[]>(this.messages);


  public messages$(): Observable<Message[]> {
    this.socket.fromEvent<Message>('message').subscribe((msg: Message): void => {
      if (msg.image) {
        msg.image = msg.image.replace('*', 'png');
        this.activeConversation.messages.push(msg);
        this.bsMessages$.next(this.messages);
        this.conversationStorage.set(this.activeConversation.id, this.activeConversation);
      } else {
        this.activeConversation.messages.push(msg);
        this.bsMessages$.next(this.messages);
        this.conversationStorage.set(this.activeConversation.id, this.activeConversation);
      }
    });
    return this.bsMessages$.asObservable();
  }

  public async sendMessage(msg: Message): Promise<void> {
    if (this.cameraPath) {
      await this.base64.encodeFile(this.cameraPath).then((base64File: string): void => {
        msg.image = base64File.replace('*', 'png');
        this.socket.emit('message', msg);
      });
      msg.image = this.webView.convertFileSrc(this.cameraPath);
    }
    await this.socket.emit('message', msg);
    this.activeConversation.messages.push(msg);
    this.bsMessages$.next(this.messages);
    this.conversationStorage.set(this.activeConversation.id, this.activeConversation);
  }

  public async setAsActiveConversation(user: Contact): Promise<void> {
    const { id } = user;
    this.activeConversation = await this.conversationStorage.get(id);
    if (this.activeConversation === null) {
      await this._newConversation(doctor);
      await this.conversationStorage.set(id, this.activeConversation);
    } else {
      this.activeConversation.messages.forEach((msg: Message): void => {
        if (msg.image) {
          msg.image = this.webView.convertFileSrc(msg.image);
        } else {
          msg.image = '';
        }
      });
      this.messages = this.activeConversation.messages;
      this.bsMessages$.next(this.messages);
    }
  }

спасибо за любую помощь