更改检测无法正常工作

Question

我使用angular4，这是我的模板

<span>My ID:{{ peerId$ | async }}</span>
<span>My ID:{{ peerId }}</span>

这是组件代码

export class AppComponent implements  OnInit {

    peerId: string = 'Guy';
    peerId$: Observable<string>;


    constructor(private store:Store<AppState>) {

    }

    ngOnInit() {

        this.peerId$ = this.store.select("peerId") as Observable<string> ;
        this.peerId$.subscribe((peerId:string)=>{
            this.peerId = peerId; // changed from 'guy' to 'blabla' in debug 
            // in template nothing changes 
        });   

不会触发Dom元素的更改，除非我专注于页面中的某种输入然后发生更改。

我已经从angular2升级到4并且仍然是同样的问题，如果我写一个简单的setTimeout或Observable我可以立即看到更改，所以我认为问题是使用ngrx / store进行更改检测。