如何从父组件更新共享服务中的数据以使用angular显示在子组件中？

Question

我有一个父组件和一个子组件。两者都共享相同的服务。单击ParentComponent上的按钮可以使用新项更新SharedService中的对象数组。当我查看我的页面时，看起来ChildComponent实际上并没有使用新条目更新其{{sharedService.listofitems}}的模板。

我正在使用github.com/AngularClass/angular-starter。我的SharedService是＆＃34; appState＆＃34;，我在这里写了appState.state.listofitems.push（{＆＃39; item＆＃39;：＆＃39; Apple＆＃39;}）。在此处链接到appState代码：https://github.com/AngularClass/angular-starter/blob/master/src/app/app.service.ts

使用角度1，我有$ scope。$ apply（...）有没有办法让我的子组件“刷新＆＃34;新数据？

ParentComponent===
constructor(public appState:AppState) {
  this.appState.set('listofitems', [])
}

buttonClicked() {
    this.appState.state.listofitems.push({'item': 'Apple'})
}

ChildComponent Template

<span>{{this.listofitems}}</span>

ChildComponent TypeScript

constructor(public appState:AppState) {
}

ngOnInit() {
  this.listofitems = this.appState.get('listofitems');
}