How to use observables in angular 2 template

stream-context.directive.ts

import { Directive, Input, TemplateRef, ViewContainerRef, EmbeddedViewRef, ChangeDetectorRef } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Subscription } from 'rxjs/Subscription';

@Directive({
    selector: '[streamContext][streamContextOn]'
})
export class StreamContext {
    @Input() streamContextOn: Observable<any>;
    templateRef: TemplateRef<any>;
    vcr: ViewContainerRef;
    cd: ChangeDetectorRef;
    _viewRef: EmbeddedViewRef<any>;
    subscription: Subscription;

    constructor(templateRef: TemplateRef<any>, vcr: ViewContainerRef, cd: ChangeDetectorRef) {
        this.templateRef = templateRef;
        this.vcr = vcr;
        this.cd = cd;
    }

    ngOnInit() {
        this.subscription = this.streamContextOn.subscribe(state => {
            if (!this._viewRef) {
                this._viewRef = this.vcr.createEmbeddedView(this.templateRef, { '$implicit': state });
            } else {
                this._viewRef.context.$implicit = state;
            }
            this.cd.markForCheck();
        });
    }


    ngOnDestroy() {
        this.subscription.unsubscribe();
    }
}

useage:

<div *streamContext="let person on person$">
  <p>{{ person.id }}</p>
  <p>{{ person.title }}</p>
  <p>{{ person.body }}</p>
</div>