angular2 viewing observable with async pipe not rendering

Question

I am using @ngrx/store and I am grabbing a slice of the state from the store.

I have a component that wants to display that slice. However, with the {{ obs$ | async}} {{ obs$ | async}} present in the template, the entire template is not rendered. If I remove the {{ obs$ | async }} {{ obs$ | async }} then SLICE: is rendered.

Any idea on why this is the case or how to diagnose the issue? The JS console isn't showing me any errors.

@Component({
  selector: 'slice',
  template: `SLICE: {{ obs$ | async }}
})
export class Slice {
  obs$: Observable<any>
  constructor(private store:Store<any>) {
    this.obs$ = this.store.select(s => s.slice);
  }
}

Answer 1

I had a similar problem once. In my case angular did not render the template when the async pipe was used inside a *ngFor block.

I was including the minified version of Angular2.beta13 and I solved by including Angular with the beautified JavaScript.

https://stackoverflow.com/a/36458828/2332293