title: Angular2 : How to handle async Pipe and conditional styling?
body: <p>I am looking forward to color some asynchronously received data in green or red, depending on its value.</p>
  
  <p>To take care of race conditions, I used a Subject, which broadcasts an Object containing the data that I'm interested in. </p>
  
  <p>I succeeded in doing what I wanted, but the resulting code is quite ugly  :</p>
  
  <p><code>&lt;span [ngClass]="{greenClass: isPositive((mySubject | async)?.fieldData), redClass: !isPositive((mySubject | async)?.fieldData)}"&gt;
      {{(mySubject | async)?.fieldData | number:'1.0-1' }}
  &lt;/span&gt;</code></p>
  
  <p>Is there a better way to tackle this ?
  I tried to put a ternary expression in ngClass but it didn't work.
  Moving code back to my controller is a no-go as it would result in the creation of ten variables straight away.</p>