title: Angular *ngFor bound to observable with async pipe - whats happening?
body: <p>I have just started with angular4 and have came up against a conceptual problem. The <code>async</code> pipe (used in combination with <code>*ngFor</code> in this case) is meant to subscribe to an observable and do away with manual subscriptions. Looking at examples on the web:</p>
  
  <p>Case 1: Binding to an observable that contains single items such as <code>Observable&lt;User&gt;</code></p>
  
  <p>Case 2: Binding to an observable that contains arrays of items such as 
  <code>Observable&lt;User[]&gt;</code></p>
  
  <p>Case 3: Variations of 1 and 2 with Subject, Promise or BehaviourSubject</p>
  
  <p>(example of case 1 single item: <a href="http://briantroncone.com/?p=623" rel="nofollow noreferrer">http://briantroncone.com/?p=623</a>)</p>
  
  <p>(example of case 2 array: <a href="http://www.concretepage.com/angular-2/angular-2-async-pipe-example" rel="nofollow noreferrer">http://www.concretepage.com/angular-2/angular-2-async-pipe-example</a>)</p>
  
  <p>Conceptually I get that the <code>ngFor</code> iterates over an enumerable and I'm assuming that the enumerable is the item emitted from the <code>Observable</code> and not the observable itself. </p>
  
  <p>So *ngFor="let user of users" is only going to work on an <code>Observable&lt;User[]&gt;</code> and not an <code>Observable&lt;User&gt;</code>? </p>
  
  <p>The <code>*ngFor</code> is triggered as each item arrives from the observable? </p>
  
  <p>If this is the case then how can we bind to an <code>Observable</code> of <code>Item</code> and not <code>Item[]</code>, how does ngFor iterate over Item when its not an enumerable? Thanks.</p>