title: Display nested data from observable in Angular 2 view
body: <p>I am using an application state service based on <code>BehaviorSubject</code>s in Rx which exposes <code>Observables</code> for components to work with. In one of my components I want to show some nested data if its present.  </p>
  
  <p>This is what I was trying</p>
  
  <pre><code>&lt;div&gt;&gt;{{  sharedState.loadedAccountDetails.accountId | async }}&lt;/div&gt;
  </code></pre>
  
  <p>Which yields me an error about not being able to get account Id of undefined which makes sense to me but I thought perhaps the async pipe would help me out here. </p>
  
  <p>In my component shared state is just an <code>Observable</code> I don' think there is much to show. </p>
  
  <p>Ultimately, I want to show this data when its present and display nothing when its not there. How can I achieve this?</p>