Angular 4：在提交时更新兄弟组件的数组

Question

我有一个Angular 4项目。我正在构建一个简单的消息视图。它由2个组件组成，它们共享一个服务。

服务：

$tags=array();
$tagline = $_POST['tags'];
//TAGS
if(!empty($tagline)){
    $tokens = str_replace(' ', '', $tagline);
    $tags = explode(',',$tokens);
    $tags = array_unique($tags);
    foreach ($tags as $tag) {
        if(preg_match("/^[0-9a-zA-Z]$/",$tag) === 0) {
            // error    
        }
        else{
            echo $count_tags = $count_tags+1;
        }
    }
    if($count_tags <= 1){
        $error[]=" - Please provide at least 2 tags, separated by commas.";
        $err_st3 = $st;
    }
    $tagsOK = implode(', ',$tags);
}
else{
    $error[]=" - Please provide at least 2 tags, separated by commas.";
    $err_st3 = $st;
}

组件一:(消息）

import {Injectable} from '@angular/core';
import {Http} from '@angular/http';

import {BehaviorSubject} from 'rxjs/BehaviorSubject';
import 'rxjs/add/operator/map';

@Injectable()
export class MessageService {

     messageAPI: string = 'http://localhost:4201';

     constructor(public $http: Http) {}

     getUsers(){
          return this.$http.get(this.messageAPI + '/users?_sort=date&_order=asc')
               .map(res => res.json());
     }

     getMessages(){
          return this.$http.get(this.messageAPI + '/messages?_sort=date&_order=asc')
               .map(res => res.json());
     }

     createMessage(data){
          return this.$http.post(this.messageAPI + '/messages', data)
               .map(res => res.json());
     }

}

组件2 :(创建表单）

import {Component, OnInit} from '@angular/core';
import {MessageService} from '../../services/message.service';

import { Message } from '../../interfaces/message.interface';

@Component({
     selector: 'app-messages',
     templateUrl: './messages.component.html',
     styleUrls: ['./messages.component.css']
})
export class MessagesComponent implements OnInit {

     messages:Message[];

     constructor(private $messageService: MessageService) {}

     ngOnInit() {

          this.$messageService.getMessages().subscribe((response) => {
               this.messages = response;
          });

     }

}

以下是应用在呈现时的外观：

我的问题是，当提交组件二（创建表单）并创建新消息时，如何使用最新消息更新组件一（消息视图）？